我正在尝试创建一个自定义组件,该组件使用从内而外的指令使用动态ng-model。
例如,我可以调用不同的组件,例如:
<custom-dir ng-model="domainModel1"></custom-dir>
<custom-dir ng-model="domainModel2"></custom-dir>
使用如下指令:
app.directive('customDir', function() {
return {
restrict: 'EA',
require: '^ngModel',
scope: {
ngModel: '=dirValue',
},
template: '<input ng-model="dirValue" />',
link: function(scope, element, attrs, ctrl) {
scope.dirValue = 'New';
}
};
});
想法是,如果模型发生更改,则指令中的文本框将发生更改,反之亦然。
事实是,我尝试了不同的方法,但都没有成功,您可以在此处检查以下方法之一:http : //plnkr.co/edit/7MzDJsP8ZJ59nASjz31g?p=preview在此示例中,我希望获得这两个输入中的值均为“ New”,因为我正在从指令中更改模型,并且是双向绑定(=)。但是,某种方式并没有以正确的方式进行约束。:(
如果有人对此表示感谢,我将不胜感激。提前致谢!
像这样吗
http://jsfiddle.net/bateast/RJmhB/1/
HTML:
<body ng-app="test">
<my-dir ng-model="test"></my-dir>
<input type="text" ng-model="test"/>
</body>
JS:
angular.module('test', [])
.directive('myDir', function() {
return {
restrict: 'E',
scope: {
ngModel: '='
},
template: '<div><input type="text" ng-model="ngModel"></div>',
};
});
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句