通常、ディレクティブではrequire: 'ngModel'
、スコープを渡したい場合に使用します。これはうまくいきます。しかし、私は現在、親から渡された異なる ngModels を持つ 5 つの異なる HTML 要素を作成するディレクティブを作成しています。属性として渡す必要がある ngmodels は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
//... .... ...
}
}
});