Angular 解析错误 ng-show

Question

我在 index.html 中的 div 上有一个 ng-show，它根据 user-clearances 确定显示哪个 header。这些间隙存储在 $scope.user.clearance 中作为间隙数组 objects。 $scope.user.clearance 的结构如下：

[
    {
       'clearance':string
    }
]

导致解析错误的指令是：

<div ng-show = "user.clearance &&
        user.clearance.filter(function(e) { return e['clearance'] === 'SUPERADMIN'; }).length > 0" 
        ng-include="'/partials/components/superadmin-header.html'">
</div>

表达式：

user.clearance && user.clearance.filter(function(e) { 
     return e['clearance'] === 'SUPERADMIN'; 
}).length > 0

在 jsfiddle 中工作得很好：http://jsfiddle.net/6frqzwee/2/

知道为什么 angular 对此有困难吗？

Answer 1

因为 ng-show 指令放 $watch on the expression which you provide on ng-show attribute。如果您将表达式作为 string 传递，它会使用当前范围对它们进行求值，但是当您传递带有属性的函数时，将抛出 $parse 错误。

更好地让它工作你可以有 angular 过滤器 | 这会给你预期的结果并且在解析 HTML

时不会抛出任何错误

<div ng-show ="user.clearance &&
    (user.clearance | filter: {clearance: 'SUPERADMIN' }).length > 0" 
    ng-include="'/partials/components/superadmin-header.html'">

如上语法 (user.clearance | filter: {clearance: 'SUPERADMIN' }) 将使用范围进行评估，它将 return 具有 clearance 属性值和 SUPERADMIN 的匹配元素数组.

Angular 解析错误 ng-show

Angular Error Parsing ng-show

javascript

angularjs

angularjs-ng-show