Angular md-virtual-repeat 指令打乱了项目顺序

Question

我正在使用 Angular Material md-virtual-repeat 指令来提高 md-list 中数千项的性能。

但是，当我向下滚动然后向上滚动时，顺序根本没有保留。一开始，我的项目是按日期排序的，没问题。当我开始滚动时，顺序变得一团糟。

这是我的标记：

<md-virtual-repeat-container class="flex flex-layout md-list indigo" ng-if="tracking.loaded">
     <div md-virtual-repeat="marker in tracking.mapMarkers | orderBy: 'timestamp':true" class="md-list-item inset" style="height: 72.6px;">
         <div class="md-list-item-content">
              <h3 class="text-md">{{ ::marker.timestamp | time }}</h3>
         </div>
     </div>
</md-virtual-repeat-container>

还有我的控制器：

self.mapMarkers = [];

...
// In a function which is called within a promise
_.each(_.without(_.reject(data.Positions, function(position){ return position.Id === currentPosition.Id; })), function (pos) {
     var location = new google.maps.LatLng(pos.Latitude, pos.Longitude);
     self.mapMarkers.push(new google.maps.Marker({
         icon: {
              url: "https://maps.gstatic.com/intl/en_us/mapfiles/markers2/measle_blue.png",
              size: new google.maps.Size(12, 12),
              anchor: new google.maps.Point(4, 4)
         },
         position: location,
         address: pos.Address,
         timestamp: pos.Timestamp,
         map: self.map
     }));
});

Answer 1

我解决了我的问题。如果使用单向绑定，md-virtual-repeat 似乎无法正确回收项目（请注意我的标记中的 :: 语法）。毕竟看起来很明显。

Angular md-virtual-repeat 指令打乱了项目顺序

Angular md-virtual-repeat directive is messing up items order

javascript

angularjs

angular-material