更新$ scope而不用ng-click并动态排序数组

时间:2017-07-10 08:45:02

标签: javascript angularjs

我在尝试通过websockets添加新记录时动态更新视图。最新的记录(默认情况下它的ID最高)应位于底部,但随机添加。我无法找到它发生的原因。



angular.module('Persistence').controller("PersistenceController", [
  "$scope",
  "$http",
  "$filter",
  "$timeout",
  "$mdDialog",
  "$sce",
  function ($scope, $http, $filter, $timeout, $mdDialog, $sce) {
    $scope.records = [];
    $scope.sortById = 'id';
    var socket2 = io.connect('192.168.1.100:3001');

    socket2.on('newInformation', function (data) {
      $scope.records.push({
        title: data.data.title,
        id : data.data.id,
        name: data.data.name
      });

      $scope.$apply();

    });    
  }
]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="Persistence" ng-controller="PersistenceController">
  <div ng-repeat="record in records | orderBy : sortById">
    <div>{{record.id}}</div>
    <div>{{record.title}}</div>
    <div>{{record.name}}</div>        
  </div>
</body>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

以正确的方式设置sortId。使用id : data.data.id代替id : data.data.title。您的属性映射是错误的,这就是全部。确保您的排序属性与其他项目相同的数据类型

$scope.records.push({
    id : data.data.id,
    title: data.data.title,
    name: data.data.name
});

请看一下 demo fiddle