web-dev-qa-db-ja.com

Angularディレクティブの複数の 'require'オプションを追加する

通常、ディレクティブでは、スコープを渡す場合はrequire: 'ngModel'を使用します。これは正常に機能します。しかし、私は現在、親から渡される異なるngModelsを持つ5つの異なるHTML要素を作成するディレクティブを作成しています。属性として渡す必要のあるngmodelはngModel1, ngModel2, ngModel3, ngModel4, ngModel5です。ディレクティブ内のrequire条件に複数のオプションを追加するにはどうすればよいですか？

私はこれらを試しましたが、機能しません：

require: ['ngModel1', 'ngModel2', 'ngModel3', 'ngModel4', 'ngModel5'],

そして

require: {'ngModel1', 'ngModel2', 'ngModel3', 'ngModel4', 'ngModel5'},

そして

require: 'ngModel1', 'ngModel2', 'ngModel3', 'ngModel4', 'ngModel5',

そして

require: 'ngModel1, ngModel2, ngModel3, ngModel4, ngModel5'},

複数のrequireオプションを追加するにはどうすればよいですか？

編集：

HTMLコード：

<div get-vehicles-checkbox
            cars-ng-model="formData.cars"           
            bikes-ng-model="formData.bikes"         
            trucks-ng-model="formData.trucks"           
            van-ng-model="formData.van"         
            bus-ng-model="formData.bus"     
></div>

指令：

app.directive('getVehiclesCheckbox', function($compile) { 
  return {
    restrict: 'A',
    replace:true,
    // require: ?
    scope: {            
      carsNgModel: '=',
      bikesNgModel: '=',
      trucksNgModel: '=',
      vanNgModel: '=',
      busNgModel: '='
    },

    controller: 'SomeController',

    link: function(scope, element, attrs, carsNgModel, bikesNgModel, trucksNgModel, vanNgModel, busNgModel) {

      scope.carsNgModel = {},
        scope.bikesNgModel = {},
        scope.trucksNgModel = {},
        scope.vanNgModel = {},
        scope.busNgModel = {}

      var html = '<span ng-repeat="car in cars">' +
          '<input type="checkbox" ng-model="carsNgModel[car.code]"> {{ car.number }} {{ car.description }}' + 
          '</span>' +

          '<span ng-repeat="bike in bikes">' +
          '<input type="checkbox" ng-model="bikesNgModel[bike.code]"> {{ bike.number }} {{ bike.description }}' + 
          '</span>';

      //.... etc.. etc.....


      // COMPILE HTML
      //... .... ...

    }
  }
});
javascriptangularjsangularjs-directiveangularjs-scopeangular-directive
16
Neel
app.directive('myDirective', function() {
  return {
    restrict: "A",
    require:['^parentDirective', '^ngModel'], 
    link: function ($scope, $element, $attrs, controllersArr) {
      // parentDirective controller
      controllersArr[0].someMethodCall();

      // ngModel controller         
      controllersArr[1].$setViewValue(); 
    }
  }
});
29
Shashank Singh