使用angularjs将ng-click应用于选择框中的选项

时间:2015-10-15 10:51:20

标签: angularjs

我之前没有使用过角度,但我正在努力让这个工作。代码对我来说是一个列表,但是我希望使用select下拉列表来完成同样的工作。有人可以帮忙吗?

<select ng-model="data.selectedOption"> <option ng-click="myFilter = {pay_status : 'Paid'}" value="Paid Work">Paid Work</option> <option ng-click="myFilter = {pay_status : 'Volunteer'}" value="Volunteer Work">Volunteer Work</option> <option ng-click="myFilter = {opento : 'Undergraduates'}" value="Undergraduates">Undergraduates</option> <option ng-click="myFilter = {opento : 'Postgraduates'}" value="Postgraduates">Postgraduates</option> </select> </div>

我曾经使用相同的代码(ng-click等)使用列表并且它起作用所以我希望我可以为选项做同样的事情但是没有......我需要改变什么?

感谢您的帮助!

1 个答案:

答案 0 :(得分:1)

您可以将select指令设置为通过控制器

绑定到您的数据
<div ng-controller="myCtrl">
  <select
    ng-model="myFilter"
    ng-options="value.label for value in myFilters">
        <option>--</option>
  </select>
  <div>
    myFilter: {{myFilter.filter}}
  </div>
</div>

和你的JS一样

function myCtrl($scope) {
  $scope.myFilters = [{
        "filter": {pay_status : 'Paid'},
        "label": "Paid Work"
    },{
        "filter": {pay_status : 'Volunteer'},
        "label": "Volunteer Work"
    },{
        "filter": {opento : 'Undergraduates'},
        "label": "Undergraduates"
    },{
        "filter": {opento : 'Postgraduates'},
        "label": "Postgraduates"
    }];

};

请参阅小提琴: - http://jsfiddle.net/vxvcbrxs/