<div class="container" ng-controller="serviceHistoryController">
<!-- Search box Start -->
<div class="dropdown col-xs-8">
<button class="btn btn-default col-xs-4" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="false" aria-expanded="true">
Select SUT
<span class="caret"></span>
</button>
<ul class="dropdown-menu col-xs-8" aria-labelledby="dropdownMenu1">
<li ng-repeat="sutname in sutlist">
<a href="#" ng-click="sutselected(sutname)">
{{sutname.name}}
</a>
</li>
</ul>
</div>
</div>
上面是我正在使用的引导程序+角度下拉代码。但一旦我点击下拉菜单,它就消失了。我正在使用 angular1 + boostrap 3.3.7 和 jquery 1.12.4 库。没有使用其他脚本或js。
以下是角度函数
app.controller("serviceHistoryController",function($scope){
let menuitems = [{"sutid":"1","name":"AA"},
{"sutid":"2","name":"BB"},
{"sutid":"3","name":"CC"},
{"sutid":"4","name":"DD"},
{"sutid":"4","name":"EE"}]
$scope.sutlist = menuitems;
$scope.selectedSUT;
$scope.sutselected = function(sutname){
$scope.selectedSUT = sutname;
alert("dropdown sut selected:"+$scope.selectedSUT.name);
}
});
问题出在你的数据类型上let use var请参阅修改后的控制器。
app.controller("serviceHistoryController",function($scope){
var menuitems = [{"sutid":"1","name":"AA"},
{"sutid":"2","name":"BB"},
{"sutid":"3","name":"CC"},
{"sutid":"4","name":"DD"},
{"sutid":"4","name":"EE"}]
$scope.sutlist = menuitems;
$scope.selectedSUT;
$scope.sutselected = function(sutname){
$scope.selectedSUT = sutname;
alert("dropdown sut selected:"+$scope.selectedSUT.name);
}
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)