Question

给出以下指令定义

app.directive('myDirective', () => (
    {
        restrict: 'E'
        require: 'ngModel',
        template: '<div id='wrapper'><input ngChange="change" /></div>'
        scope: {change: '='},
        link: ...
    }
))

如果我像这样使用它

<my-directive change="change" ng-model="myModel" />

如何将ng-model从my-directive传递到input

Answer 1

使用单向<来绑定输入，使用$setViewValue来设置输出：

app.directive('myDirective', function() {
    return {
        restrict: 'E',
        require: 'ngModel',
        template:
            `<div id='wrapper'>
                 <input ng-change="change(inputValue)" ng-model="inputValue" />
             </div>`,                  
        scope: {inputValue: '<ngModel'},
        link: postLink              
    };
    function postLink(scope, elem, attrs, ngModel) {
        scope.change = function(value) {
            ngModel.$setViewValue(value);
        };
    }
})

用法：

<form name="form1">
    <my-directive name="item1" ng-model="myModel" ng-change="func1()">
    </my-directive>
</form>

ng-change指令将由ngModelController自动添加。

AngularJS框架会将ngModelController API放在作为$scope.form1.item1的范围内。

有关详细信息，请参阅

如何将ng-model从指令传递给模板

1 个答案: