Dre*_*MTT 15 angularjs angularjs-directive angularjs-scope
我正在尝试创建一个自定义组件,该组件在指令内部使用动态ng模型.
作为一个例子,我可以调用不同的组件,如:
<custom-dir ng-model="domainModel1"></custom-dir>
<custom-dir ng-model="domainModel2"></custom-dir>
Run Code Online (Sandbox Code Playgroud)
使用如下指令:
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';
}
};
});
Run Code Online (Sandbox Code Playgroud)
我们的想法是,如果模型发生变化,指令中的文本框会发生变化,反之亦然.
问题是我尝试了不同的方法,但没有成功,你可以在这里查看其中一个:http://plnkr.co/edit/7MzDJsP8ZJ59nASjz31g?p=preview在这个例子中,我希望有两个输入中的值'New',因为我正在从指令更改模型并且是双向绑定(=).但不知何故,并没有以正确的方式约束.:(
如果有人对此有所了解,我将非常感激.提前致谢!
Ban*_*ack 40
像这样的东西?
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>
Run Code Online (Sandbox Code Playgroud)
JS:
angular.module('test', [])
.directive('myDir', function() {
return {
restrict: 'E',
scope: {
ngModel: '='
},
template: '<div><input type="text" ng-model="ngModel"></div>',
};
});
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
23676 次 |
| 最近记录: |