Question

我尝试使用对象进行过滤，然后通过对象中的ng-repeat = (key, value)打印过滤器。

当我尝试各种filters时，我发现ng-repeat似乎无法使用对象的$属性，如果您正在过滤，这非常有用。

即使您使用$

，是否有可能自动显示过滤对象的所有属性

This link表示它似乎不适用于以$

开头的对象

  $scope.testObj = {};

  $scope.testObj.test = 'test';
  $scope.testObj.$ = '$';
  $scope.testObj.$test = '$test';

  <div ng-repeat = "(key, value) in testObj">
    <p>{{key}}: {{value}}</p>
  </div>

Answer 1

看起来ng-repeat会过滤掉以$开头的对象属性。

这是the source：

    for (var itemKey in collection) {
      if (collection.hasOwnProperty(itemKey) && itemKey.charAt(0) != '$') {
        collectionKeys.push(itemKey);
      }
    }

这很可能是因为Angular使用$来表示内部到Angular库的代码。

似乎只有在对象上使用ng-repeat时才会出现这种情况。

Answer 2

AngularJS尚不支持它。有open issue on Github。

但是你可以使用一些代码来实现它：

app.controller('MainCtrl', function($scope) {

  var getProperties = function(input){
     var result = [];

     for(var propertyName in input) {
       result.push({key : propertyName, value : input[propertyName]});
     }

    return result;
  };


  $scope.testObj = {};
  $scope.testObj.test = 'test';
  $scope.testObj.$ = '$';
  $scope.testObj.$whatever = '$whatever';

  $scope.testObjProperties = getProperties($scope.testObj);

});

然后在您的视图中显示：

<div ng-repeat="property in testObjProperties">
    <p>{{property.key}} : {{property.value}}</p>
</div>

这是一个有效的插件：http://plnkr.co/edit/LFrfLcpoOg0ScEY89p25?p=preview

Answer 3

我看到他们在代码中被禁止使用：

https://github.com/angular/angular.js/blob/master/src/ng/directive/ngRepeat.js#L341

周围没有任何评论，我同意这看起来不仅仅是一个错误，而是一个功能。是不是标记属性为不可枚举的Object.keys是什么？浏览器兼容性地狱，可能是一如既往的原因。

ngrepeat不会迭代$ attribute

3 个答案: