我正在尝试创建一个自定义组件,该组件在指令内部使用动态ng模型.
作为一个例子,我可以调用不同的组件,如:
使用如下指令:
app.directive('customDir', function() { return { restrict: 'EA', require: '^ngModel', scope: { ngModel: '=dirValue', }, template: '', 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>', }; });