Angularjs 单击uib按钮单选元素时，在更新模型之前触发ng change指令

这是一个plnkr：

我使用uib按钮单选元素在ng重复上切换有源滤波器

  <div ng-controller="ButtonsCtrl as $ctrl">
    <h4>Radio</h4>
    <pre>Model: {{$ctrl.radioModel}}</pre>
    <div class="btn-group">
      <label class="btn btn-primary" ng-change="$ctrl.do()" ng-model="$ctrl.radioModel" uib-btn-radio="'Left'">Left</label>
      <label class="btn btn-primary" ng-change="$ctrl.do()" ng-model="$ctrl.radioModel" uib-btn-radio="'Middle'">Middle</label>
      <label class="btn btn-primary" ng-change="$ctrl.do()" ng-model="$ctrl.radioModel" uib-btn-radio="'Right'">Right</label>
    </div>

    <p ng-repeat="item in $ctrl.filtered = ($ctrl.collection | filter: { Value: $ctrl.radioModel } )">{{item | json}}</p>

    <p>First filtered item: {{$ctrl.active | json}}</p>

---

当选定的筛选器发生更改，并且随后更新集合时，我希望选择筛选集合中的第一项。但是，在筛选器更新集合之前，似乎启动了ng change/ng click函数。

您可以在JavaScript中而不是在标记中应用筛选逻辑

在HTML中，将ng repeat表达式更改为：

angular.module('ui.bootstrap.demo').controller('ButtonsCtrl', function ($scope, $filter) {

初始化筛选的数组：

ctrl.do = function() {
    ctrl.filtered = $filter('filter')(ctrl.collection, { Value: ctrl.radioModel });
    ctrl.active = ctrl.filtered[0];
}

并在do change处理程序中执行筛选：

---

我的实际代码比我提供的示例要复杂一些，需要链接过滤器，但这使我走上了正确的道路，同时

angular.module('ui.bootstrap.demo').controller('ButtonsCtrl', function ($scope, $filter) {

ctrl.filtered = [];

ctrl.do = function() {
    ctrl.filtered = $filter('filter')(ctrl.collection, { Value: ctrl.radioModel });
    ctrl.active = ctrl.filtered[0];
}