AngularJS: Why is my directive's link function not being called?

喜夏-厌秋 提交于 2019-12-25 03:44:04

问题


I am using ngTagsInput and would like to perform some validation on my models as they change. Here is a Plunker of what I'd like to achieve.

Markup:

<div ng-repeat="field in fields">
    <tags-input ng-model="field.selectedData" max-tags="{{field.maxTags}}" enforce-max-tags placeholder="{{option.placeholder}}">
          <auto-complete source="updateAutocomplete($query)"></auto-complete>
     </tags-input>
</div>

Fields / models:

$scope.fields = [
    {
        name: 'assay',
        placeholder: 'Select one assay...',
        maxTags: 1,
        selectedData: [] // These are the models
    },
    {
        name: 'cellLines',
        placeholder: 'Select cell line(s)...',
        maxTags: 5,
        selectedData: []
    },
    ...
]

Finally, my enforceMaxTags directive:

.directive('enforceMaxTags', function() {
    return {
        require: 'ngModel',
        link: function(scope, element, attrs, ngModelCtrl) {
            ngModelCtrl.$parsers.push(function(value) {
                console.log('link called');
            });
        }
    };
})

The enforceMaxTags directive is being compiled, but the link function is not called even when the models change. The data binding does appear to work, though, because if I console.log the selectedData on form submission, it is filled with the correct objects. What am I missing?

Thanks in advance.

来源:https://stackoverflow.com/questions/30088305/angularjs-why-is-my-directives-link-function-not-being-called

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!