[英]How to connect my controller in my directive for inserting data and adding bootstrap select in angular.js?
我正在嘗試使用控制器在SELECT菜單上添加數據,並使用ng-options,同時我在指令中定義了一個類來將bootstrap-select插件插入到元素中。 問題是控制器中的數據不起作用,指令上存在沖突,甚至嘗試在指令中使用require和controller方法。
請看一下我的代碼:
HTML
<div ng-controller="CitiesController" class="form-group pull-left form-register-width-field form-register-select">
<label for="city">City</label>
<select id="city" ng-model="selectedItem" ng-options="item as item.name for item in cities" class="selectpicker">
<option>Select City</option>
</select>
</div>
我的控制器:
function CitiesController($scope) {
console.log('cities controller');
$scope.cities = [
{value:'1',name:'Angeles'},
{value:'2',name:'Angono'},
{value:'3',name:'Antipolo'},
{value:'4',name:'Apalit'},
{value:'5',name:'Arayat'},
{value:'6',name:'Bacolod'},
{value:'7',name:'Bacoor'}
];
console.log($scope.cities[2]);
}
我的指令:
angular.module('myApp.directives', [])
.directive('selectpicker', function() {
return {
restrict: 'C',
link: function(scope,el,attr,cntr) {
$(el).selectpicker();
}
}
})
謝謝您的幫助 :)
嘗試在指令本身中添加控制器,例如:
angular.module('myApp.directives', [])
.directive('selectpicker', function() {
return {
restrict: 'C',
controller: function($scope){
$scope.cities = [
{value:'1',name:'Angeles'},
{value:'2',name:'Angono'},
{value:'3',name:'Antipolo'},
{value:'4',name:'Apalit'},
{value:'5',name:'Arayat'},
{value:'6',name:'Bacolod'},
{value:'7',name:'Bacoor'}
];
},
link: function(scope,el,attr,cntr) {
$(el).selectpicker();
}
}
});
角帶提供以下URL的同一“ bsSelect”指令:
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.