1個元素上的多個指令

1：Angular UI select - 此指令使用隔離範圍。

2：myDirective - 在我的自定義指令，我也用隔離範圍訪問ngModel

我收到多個指令錯誤的值不能共享隔離範圍。這就是我在我的指令中聲明隔離範圍的方式。

require: 'ngModel',   
      scope: { 
       modelValue: "=ngModel" 
      }, 
      link: function (scope, el, attrs, ctrl) {

我用它像：

<ui-select myDirective multiple ng-model="GroupsModel" theme="select2" ng-disabled="disabled" style="width: 300px;" hidden-text-box "> 
     <ui-select-match placeholder="groups">{{$item}}</ui-select-match> 
     <ui-select-choices repeat="color in Groups "> 
      {{color}} 
     </ui-select-choices> 
    </ui-select>

我的問題是，我怎麼能訪問從我的自定義指令的ngmodel值，如果多個指令不能一起1元所使用的，是有圍繞這一點的工作仍將保持約束力？

更新

我不能在我的指令下列功能訪問所需的NG模型價值，如果我不使用空scope: {},

scope.reset = function() { 

          var modelValue =ctrl.$viewValue; 

          $timeout(function() { 
           el[0].focus(); 
          }, 0, false); 
         };

這裏是我的指令：

var app = angular.module('app'); 
app.directive('resetField', [ 
     '$compile', '$timeout', '$http', function ($compile, $timeout, $http) { 
      return { 
       require: 'ngModel',         
       link: function (scope, el, attrs, ctrl) { 

        // compiled reset icon template 
        var template = $compile('<i ng-show="enabled" ng-mousedown="reset()" class="fa fa-floppy-o" style="padding-left:5px"></i>')(scope); 
        el.after(template); 

        scope.reset = function() { 

         var modelValue =ctrl.$viewValue; 

         $timeout(function() { 
          el[0].focus(); 
         }, 0, false); 
        }; 

        el.bind('input', function() { 
          scope.enabled = !ctrl.$isEmpty(el.val()); 
         }) 
         .bind('focus', function() { 
          scope.enabled = !ctrl.$isEmpty(el.val()); 
          scope.$apply(); 
         }) 
         .bind('blur', function() { 
          scope.enabled = false; 
          scope.$apply(); 
         }); 
       } 
      }; 
     } 
    ]);

來源

2015-10-19 joe

如果您僅使用隔離範圍來獲取select的ng模型，則可以不使用i過於寬泛的範圍。

在鏈接功能只需使用scope[attrs.ngModel]，你甚至可以把守着它（只要ngmodel是一個對象的屬性ng-model=obj.prop1）

來源

2015-10-19 04:18:19 Chandermani

我用我的指令更新了我的問題，你可以看看 – joe

您可以在一個元件上使用多個指令，這個問題是在應用在該指令

angular.directive('myDirective', [function(){ 

    return { 
     scope: false, 
     require: 'ngModel', 
     link: function(scope, element, attr, ctrl){ 

      scope.modelValue = ctrl.$viewValue; 

     } 
    } 

}])

來源

2015-10-19 04:19:01 MarkoCen

對不起還有另外一個我沒有提到的情況。有時MyDirective沒有使用多個指令。鑑於此，您的解決方案將工作？ – joe

使用「要求」，以便能夠訪問另一個指令的控制器：一個元素上多個相互隔離的範圍是無效的，可以使用require需要另一個指令在myDirective。然後，您可以將該控制器注入指令實現的參數中。但是，如果您這樣做，則不能使用隔離範圍。

來源

2015-10-19 04:48:27

如果您需要使用兩個指令，請確保第二個指令不是孤立的指令。

來源

2015-10-19 16:18:22

但有時候，我需要使用myDirective而無需其他指令。在這種情況下，如何在沒有隔離範圍的情況下訪問ngmodel值？ – joe

您將使用的範圍將是該元素所在的控制器。您可以修改各自控制器中的變量 –

我已用我的指令更新了我的問題，如果您使用正常指令，請致電 – joe

1個元素上的多個指令

回答

相關問題