错误：$ compile：multidir多指令资源争用

我有一个简单的指令，呈现视图上的选择字段。我收到下面的错误。

当我删除“替换：真”，它运作良好。

Error: $compile:multidir 
Multiple Directive Resource Contention 
Multiple directives [ngModel, ngModel] asking for 'ngModel on: {5}

下面是代码：

(function() { 

function YesNoDecline($timeout) { 

    return { 
     restrict: 'E', 
     replace: true, 
     template: '<select class="form-control" id="{{ ::id }}" name="{{ ::name }}" ng-model="ngModel.$viewValue"> ' + 
        '  <option ng-repeat="obj in data" value="{{ ::obj.value }}">{{ ::obj.text }}</option>' + 
        '</select>', 
     require: 'ngModel', 
     scope: { 
      id: '@', 
      name: '@', 
      data: '=ds' 
     }, 

     link: function (scope, element, attrs, ngModelCtrl) { 

      scope.ngModel = ngModelCtrl; 

     } 
    }; 
}; 

YesNoDecline.$inject = ['$timeout']; 
appModule.directive('yesNoDecline', YesNoDecline); 
})();

来源

2017-04-04 Bill

因为你YesNoDecline指令有replace: true集，该指令被绑定到包含它的模板元素的最外层，在这种情况下，你<select>元素。这个select元素正在请求一个ng-model指令。

我假设你的呼叫模板有一条线，如<yes-no-decline ng-model="myForm.myBool"></yes-no-decline>。这会导致在一个元素上发出2个ng-model指令的请求，这不起作用。 HTML不允许您在元素上拥有2个相同的属性。有几种方法，使这一走：

关闭replace: true
与<div>
更改需要对require:'^^ng-model'和您的电话代码<div ng-model="myForm.myBool"><yes-no-decline></yes-no-decline></div>
包装你<select>元素改变你的指令，不需要ng模型，而只需要另外一个参数。最后一个选项是唯一一个让您的指令直接生成<select>元素

来源

2017-09-29 16:28:15 JMC

错误：$ compile：multidir多指令资源争用

回答

相关问题