我是指令的范围属性
当我使用 show
作为 attr 名称时,它工作正常。
<span ng-repeat="field in fields">
<field-pill field="field" show="true"></field-pill>
</span>
app.js
angular.module('app',[]);
angular.module('app')
.controller('AppCtrl', function($scope){
$scope.fields = [1,2,3,4];
});
angular.module('app')
.directive('fieldPill', function () {
return {
template: '<div class="pill">{{field}}:{{show}}--<span ng-show="show">x</span></div>',
restrict: 'E',
scope:{
field: "=",
"show": "="
}
};
});
(请参阅此 plunkr http://plnkr.co/edit/AcqmxeCerCOtGaw9dq9t?p=preview )
但是当我使用 x-show
作为属性名称时,该指令根本不会加载 bool 数据。
<span ng-repeat="field in fields">
<field-pill field="field" x-show="true"></field-pill>
</span>
app.js
angular.module('app',[]);
angular.module('app')
.controller('AppCtrl', function($scope){
$scope.fields = [1,2,3,4];
});
angular.module('app')
.directive('fieldPill', function () {
return {
template: '<div class="pill">{{field}}:{{xShow}}--<span ng-show="xShow">x</span></div>',
restrict: 'E',
scope:{
field: "=",
xShow: "="
}
};
});
谁能解释一下为什么吗?
(请参阅此 plunkr,了解带有 x-show
http://plnkr.co/edit/2txoY3VaShH6WggnugcE?p=preview 的代码)
最佳答案
我认为这与x-
前缀有关。如果您将其更改为 mShow
、m-show
之类的内容,它将起作用。
来自 HTML5 spec :
Attribute names beginning with the two characters "x-" are reserved for user agent use and are guaranteed to never be formally added to the HTML language. For flexibility, attributes names containing underscores (the U+005F LOW LINE character) are also reserved for experimental purposes and are guaranteed to never be formally added to the HTML language.
因此请避免使用 x-
作为普通属性名称。 :)
关于angularjs - Angular "="范围不适用于驼峰命名法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18348692/