带有 AngularStrap 选择元素的 Onchange 事件

【问题标题】：Onchange event with AngularStrap select element带有 AngularStrap 选择元素的 Onchange 事件
【发布时间】：2016-07-06 18:19:24
【问题描述】：

我想在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 指令，但它在单击时捕获当前选定值的值，而不是在元素更改时

谢谢

【问题讨论】：

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

【解决方案1】：

有几个选项使用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>

【讨论】：