无法调用Object.keys在angularjs [英] Unable to call Object.keys in angularjs

查看:194
本文介绍了无法调用Object.keys在angularjs的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用的是UI.Bootstrap手风琴和我定义我的标题像这样:

<手风琴组纳克=重复=(CNAME,站)在byClient>
    <手风琴标题>
        {{CNAME}}<跨度类=右拉> {{Object.keys(站)。长度}}台与LT; / SPAN>
    < /手风琴标题>

在显示的 Object.keys(站)。长度解析不了了之。如果我把同样长度的呼叫在我的控制器我回去预期计数。是不是有什么$ P $从AngularJS工作pventing方法调用?

使用如预期的行为手风琴的休息,所以我知道它被正确填充。在 byClient 数据结构基本上看起来像这样:

{
    客户名称 : {
        站名: [
            {...},
            {...}
        ]
    }
 }


解决方案

是的,那是因为对象窗口/全局中的一部分和角度不能对评估范围的前pression。当您指定 Object.keys 在你结合的角度尝试对其进行评估对 $范围并没有找到它。你可以在rootScope一些实用的 object.keys 引用存储和应用程序的任何地方使用它。

事情是这样的: -

  angular.module('yourApp',[DEPS ...])。运行(函数($ rootScope){
  //只是一个参考添加到rootscope一些实用的方法。
  $ rootScope.Utils = {
     键:Object.keys
  }  //如果你想在隔离范围进行访问实用方法
  //那么你会直接添加方法rootScope的原型
  //作为一个粗略的实现如下图所示的构造。  //$rootScope.constructor.prototype.getKeys = Object.keys;});

和使用它作为: -

 <跨度类=右拉> {{Utils.keys(站)。长度}}台与LT; / SPAN>

嗯,这将提供给任何儿童范围,除了隔离范围。如果你计划做在隔离范围(如: - 隔离范围的指令),你就需要在范围添加 Object.keys 的参考,也可以在露出范围的方法,该方法将返回长度。

或者更好的是,创建一个过滤器的格式返回keylength到处使用它。

  app.filter('keylength',函数(){
  返回功能(输入){
    如果(!angular.isObject(输入)){
      抛出错误(非物的使用与keylength过滤器!)
    }
    返回Object.keys(输入)。长度;
  }
});

和做的事: -

  {{站| keylength}}

演示

I'm using a UI.Bootstrap accordion and I've defined my heading like so:

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

When that displays the Object.keys(stations).length resolves to nothing. If I put that same length call in my controller I get back the expected count. Is there something preventing the method call from working in AngularJS?

The rest of the accordion that uses stations acts as expected, so I know that it's being populated properly. The byClient data structure basically looks like so:

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

解决方案

Yes, That is because Object is a part of window/global and angular cannot evaluate that expression against the scope. When you specify Object.keys in your binding angular tries to evaluate it against the $scope and it does not find it. You could store the reference of object.keys in some utility in rootScope and use it anywhere in the app.

Something like this:-

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;

});

and use this as:-

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

Well this will be available to any child scopes except for isolated scopes. If you are planning to do it on the isolated scope (eg:- Isolated scoped directives) you would need to add the reference of Object.keys on the scope, or as you expose a method on the scope which will return the length.

Or better yet , create a format filter to return the keylength and use it everywhere.

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;
  }
});

and do:-

{{ stations | keylength }}

Demo

这篇关于无法调用Object.keys在angularjs的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆