使用 angularjs/ui-bootstrap 制作手风琴并使用 ng-model

我使用 angularJs 和 bootstrap。我制作了一个手风琴，其中我放置了一个选择来选择过滤器的值和不起作用的 data-ng-model （如果他不在手风琴中，则选择可以工作）。这是我的代码：

<accordion close-others="oneAtATime">
    <accordion-group is-open="isOpen">
        <accordion-heading>
            Country<i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': isOpen, 'glyphicon-chevron-right': !isOpen}"></i>
        </accordion-heading>
        <select data-ng-model="country" class="input-medium inputFilter form-control">
            <option value="">All country</option>
            <option value="1">Switzerland</option>
            <option value="2">France</option>
            <option value="3">Spain</option>
        </select>
    </accordion-group>
</accordion>
<div data-ng-repeat="city in listcity |filter:country">
    {{city.name}}, {{city.country}}
</div>

我看过手风琴的 UI-Bootstrap。我想我必须制定一个指令才能使其工作，但该指令不适用于手风琴。这是我的指令，不起作用

app.directive('accordion', function () {
return {
    scope: {
        dataNgModel: '=',
    },
  };
});

我不确定这是否是您想要的。但我使用 ng-change 来设置新的过滤器值。

控制器：

function AccordionDemoCtrl($scope) {
  $scope.oneAtATime = true;
  //default: all countrys
  $scope.country = '';
  //example data
  $scope.listcity = [{
    name: 'Madrid',
    country: '3'
  }, {
    name: 'Paris',
    country: '2'
  }, {
    name: 'Lyon',
    country: '2'
  }, {
    name: 'Zurich',
    country: '1'
  }];

  //set a new selection
  $scope.setCountry = function(cid) {
    $scope.country = cid;
  }
}

Markup:

 <select ng-model="country" ng-change="setCountry(country)" class="input-medium inputFilter form-control">

看到它工作here http://plnkr.co/edit/bvc3tqS1lDs9CYRQMf1e?p=preview

之间：示例指令是我见过的最短的。啊，我希望这很容易:-)