设置ngIf优先级(600)高于{{ }}(100)的原因是什么？是否应该具有较低的优先级来允许{{ }}内部ng-if属性值？
我想在$scope变量中有一个条件:
控制器:
app.controller('MainCtrl', function($scope, $http, $parse) {
$scope.hide = "check === 'hidden'";
$scope.parsecond = function (cond) {
return $parse(cond)($scope);
};
});
模板:
<body ng-controller="MainCtrl">
<div ng-if="!{{hide}}">funky ng-if div</div>
<div ng-hide="{{hide}}">ng-hide div</div>
<div ng-if="!parsecond(hide)">ng-if div</div>
<input type="input" ng-model="check" />
</body>
ng-hide工作正常,因为它解析hide变量的内容并返回"check ==='hidden'",然后由ng-hide指令进行评估.
但是在插入之前ng-if尝试进行评估{{hide}}有机会解析字符串,因此 ng-if抛出异常.
我发现的唯一解决方案是调用一个函数,它基本上完成了interpolate指令的工作并返回解析的内容.
Plnkr显示问题:链接
编辑:
在阅读文档之后,我发现更好的方法,而不需要自定义方法,$scope因为angularjs已经有一个方法可以解析变量对其current $scope($eval).
所以我的解决方案是:
<body ng-controller="MainCtrl">
<div ng-if="!$eval(hide)">funky ng-if div</div>
<div ng-hide="{{hide}}">ng-hide div</div>
<div ng-if="!parsecond(hide)">ng-if div</div>
<input type="input" ng-model="check" />
</body>
更新了plnkr:链接
虽然这仍然无法解释为什么ngIf具有更高的优先级.
编辑2:
只是让人们明白它不一样:
例如:
控制器:
$scope.value = "hi";
$scope.condition = "value === 'bye'";
HTML:
<div ng-hide="condition"></div> <!--This will be evaluated to true since !!"value ==='bye'" = true. -->
<div ng-hide="{{condition}}"></div> <!--This will be evaluated to false since value !== 'bye' = false -->
<div ng-if="condition"></div> <!--This will be evaluated to true since !!"value === 'bye'" = true. -->
<div ng-if="{{condition}}"></div> <!--This will give an exception since ngIf directive ran before interpolation directive in the $compile step. -->
<div ng-if="$eval(condition)"></div> <!--This will be evaluated to false since value !== 'bye' = false. -->
我的结论是,$parse如果您希望指令在字符串中而不是在作用域上的属性中评估/设置监视,则使用起来会更安全.虽然这是真的,我可以使用{{ }}用于ng-hide/ ng-show或具有较低的优先级比100的任何指令,但我猜,因为我根据在编译顺序它不是安全的,它不是100%明确表示,将不会在将来改变补丁.
ng-if期望它的值是一个有角度的表达 - 它只是在使用引擎盖下$scope.$watch。因此，如果要限制包含ng-if在范围内定义的某个变量上的内容的条件（请说scope.hide：）ng-if="hide"，则可以添加标记。这里没有双大括号。
现在回到您的问题：确实ng-if优先级为600，但这$interpolate是angular的服务-不是指令。因此，$interpolate没有定义优先级。你从哪里得到100从来的？
您始终可以通过添加标记ng-if来限制某些功能（包括说scope.conditionFn）上的内容ng-if="conditionFn()"。
我更新了您的PLNKR以使其正常运行。插拔器之间ng-if和ng-hide中的不一致与内插的优先级无关$compile。
插值的顺序在这里起作用似乎是正确的，但是...我真的看不到有什么充分的理由在angular的表达式内进行插值。ng-if具有较高优先级的原因是它从DOM中删除/向DOM添加了被ng-hide隐藏的内容，而仅显示/隐藏了被隐藏的内容。我认为，一个指令似乎起作用而另一个指令不起作用完全是巧合。但是，如果您不使用不必要的多余花样，那么两者都会按预期工作，这正是我的骗子所显示的。
| 归档时间： |
|
| 查看次数： |
4254 次 |
| 最近记录： |