使用AngularStrap select元素的Onchange事件

时间:2014-08-21 23:46:52

标签: angularjs twitter-bootstrap-3 angular-strap


我想在select元素的值发生变化时执行一个函数(angular-strap中的select元素是html标签)
我的HTML:

 <button type="button" class="btn btn-default" ng-model="selectedCriteria" data-html="1" ng-options="choice.value as choice.label for choice in selectChoices" bs-select>
      Action <span class="caret"></span>
    </button>

我的JS:

$scope.selectedCriteria = "Location";
$scope.selectChoices = [{'value':'Location','label':'<i class=\'fa fa-map-marker\'></i> Location'},
{'value':'Age','label':'<i class=\'fa fa-male\'></i> Age'}];

我尝试在控制器中添加带有函数的ng-click指令,但是当元素发生变化时,它会在点击时捕获当前所选值的值

由于

1 个答案:

答案 0 :(得分:5)

有一些选项正在使用ngChange Reference

另一个是使用$watch。请参阅scopeapi reference

的$ watch部分

使用watch 的示例(这将在您的控制器中)

$scope.$watch('selectedCriteria', function() {
     $scope.SomeFunction();
});

使用ngChange

的示例
<button type="button" class="btn btn-default" 
   ng-change="SomeFunction()"
   ng-model="selectedCriteria" data-html="1" 
   ng-options="choice.value as choice.label for choice in selectChoices" bs-select>
      Action <span class="caret"></span>
</button>