Meteor Mongo.Cursor returns duplicate rows in Tracker.autorun

I am converting Mongo.Cursor to array using fetch() in Tracker.autorun and assigning it to the songsArray. But each time the underlying database is changed(reactively), I see duplicate values in songsArray

private songsArray:Array<any>;
songsCursor:Mongo.Cursor<any>;

//...Some code here
ngOnInit():any {
//... Some code here

    this.songsCursor = Songs.find();
    Tracker.autorun(() => {
        this.songsArray = [];
        this.songsArray = this.songsCursor.fetch();
    });
}

Why is it happening and if I assume I am doing it wrong, then what is the correct way to convert cursors to array reactively?

Based on your code sample the only way your songsArray would have duplicate values in it would be if they’re coming from your cursor (since you’re assigning the results of songsCursor.fetch() to your songsArray variable). Are you sure songsArray has duplicate values or do you mean you’re seeing duplicate values when you print out the contents of songsArray somewhere? For example, what do you see if you add a console.log here:

Tracker.autorun(() => {
  this.songsArray = [];
  this.songsArray = this.songsCursor.fetch();
  console.log(this.songsArray);
});

@hwillson thanks for the tip.
Actually this.songsArray's size is correct. But the UI where this array is bound via angular shows multiple elements.

I think it seems an angular issue now