hcv*_*vst 2 angularjs angularjs-directive
请在Plunker上试一试 - http://plnkr.co/edit/js7WOhjgKwUeElrdNwv0?p=preview
我该怎么解决这个问题呢？与Plunker及以下的示例不同,我正在处理的指令需要一个独立的范围(或者至少当前的实现使用一个,我宁愿不重写它).
<!DOCTYPE html>
<html>
<head>
<script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script data-require="angular.js@*" data-semver="1.1.5" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js"></script>
<script>
var app = angular.module("MyApp",[]);
app.directive("myDirective", function(){
return {
//scope:{},
link: function(){}
};
});
</script>
<style>
.ng-invalid{
border: 1px solid red;
}
</style>
</head>
<body ng-app="MyApp">
<h1>My Directive</h1>
<p>Test the checkbox below then uncomment //scope:{} and try again.</p>
<input type="checkbox" ng-model="isActive" />
<input type="text" ng-model="foo"
my-directive
ng-disabled="!isActive"
ng-required="isActive" />
</body>
</html>
最好的问候,汉斯
问题是范围适用于整个DOM元素(即,<input>在这种情况下),并且my-directive正在创建一个隔离范围,然后应用于ng-disabled和ng-required.隔离范围不会从封闭范围原型继承,因此isActive在其中不可见.
您可以将该范围属性映射到隔离范围,方法是将其作为隔离范围的属性显式提供,然后从ng-required和引用该属性的本地版本ng-disabled.例如,在指令定义中:
scope: {
myActive: '='
}
'='设置my-active与该元素的属性中给出的表达式的双向绑定,具有本地名称myActive.
在<input>标签中:
my-directive my-active="isActive" ng-required="myActive" ng-disabled="!myActive"
my-active="isActive"关系isActive在父范围myActive的分离范围.
我已经更新了你的plunker来证明这一点.