无法在angularjs中调用Object.keys

时间:2014-08-14 03:12:28

标签: javascript angularjs angular-ui-bootstrap

我使用的是UI.Bootstrap手风琴,我已经定义了我的标题:

<accordion-group ng=repeat="(cname, stations) in byClient">
    <accordion-heading>
        {{ cname }} <span class="pull-right"> {{ Object.keys(stations).length }} Stations</span>
    </accordion-heading>

当显示Object.keys(stations).length解析为空时。如果我在控制器中放入相同长度的呼叫,我会收回预期的计数。是否存在阻止方法调用在AngularJS中工作的内容?

使用stations的手风琴的其余部分按预期行事,因此我知道它已被正确填充。 byClient数据结构基本上如此:

{
    "Client Name" : {
        "Station Name": [
            {...},
            {...}
        ]
    }
 }

5 个答案:

答案 0 :(得分:79)

是的,这是因为Objectwindow/global的一部分,而angular无法根据范围评估该表达式。当您在绑定角度中指定Object.keys尝试根据$scope对其进行评估时,它找不到它。您可以将object.keys的引用存储在rootScope中的某个实用程序中,并在应用程序的任何位置使用它。

这样的事情: -

angular.module('yourApp',[deps...]).run(function($rootScope){
  //Just add a reference to some utility methods in rootscope.
  $rootScope.Utils = {
     keys : Object.keys
  }

  //If you want utility method to be accessed in the isolated Scope 
  //then you would add the method directly to the prototype of rootScope 
  //constructor as shown below in a rough implementation.

  //$rootScope.constructor.prototype.getKeys = Object.keys;

});

并将其用作: -

<span class="pull-right"> {{ Utils.keys(stations).length }} Stations</span>

除了隔离范围之外,任何子范围都可以使用。如果您计划在隔离范围上执行此操作(例如: - 隔离范围指令),则需要在范围上添加Object.keys的引用,或者在范围上公开将返回长度的方法

或者更好的是,创建一个格式过滤器以返回键长并在任何地方使用它。

app.filter('keylength', function(){
  return function(input){
    if(!angular.isObject(input)){
      throw Error("Usage of non-objects with keylength filter!!")
    }
    return Object.keys(input).length;
  }
});

并做: -

{{ stations | keylength }}

<强> Demo

答案 1 :(得分:3)

使用该函数确定对象属性的数量:

{{ keyLength(myObj) }}

并使用:

fun getAllTitles(): ArrayList<String>

答案 2 :(得分:2)

我认为过滤器是处理模板代码中结构的最AngularJS方式:

angular.module('app.filters').filter('objectKeysLength', [function() {
    return function(items) {
        return Object.keys(items).length;
    };
}]);

angular.module('app.filters').filter('objectKeys', [function() {
    return function(item) {
        if (!item) return null;
        var keys = Object.keys(item);
        keys.sort();
        return keys;
    };
}]);

答案 3 :(得分:0)

如果有人搜索角度2和更高解。现在,它在keyvalue管道上有帽子,可用于插入对象

答案 4 :(得分:0)

我无法在AngularJS 1.6中获得其他答案。什么对我有用 使用$window来访问Object.keys,例如$window.Object.keys({ 'a': 1, 'b': 2 })