如何使用angularJS在一组选择中获取所选选项

时间:2015-02-11 12:22:29

标签: angularjs

我有一组两个选择。第一个是主题的名称,第二个是它的速率(可以是主要的或重要的)。我可以添加更多主题(这两个选项中的更多组)。我是angularJS的新手,我正在试图弄清楚如何在这些组中获得所选的选项。

这就是我所拥有的:

控制器

function MyCtrl($scope) {
$scope.topic_rows = [{
    executive_pay_ratio: [{
        topic_cd: 't1',
        topic_name: 'topic 1'
    },
    {
        topic_cd: 't2',
        topic_name: 'topic 2'
    },
    {
        topic_cd: 't3',
        topic_name: 'topic 3'
    },
    {
        topic_cd: 't4',
        topic_name: 'topic 4'
    }],
    rate_order_interest: [{
        rate_cd: 'i',
        rate_name: 'important'
    },
    {
        rate_cd: 'm',
        rate_name: 'major'
    }]
}];

$scope.currentTopic_rows = [{
    executive_pay_ratio: [{
        topic_cd: 't1',
        topic_name: 'topic 1'
    }],
    rate_order_interest: [{
        rate_cd: 'i',
        rate_name: 'important'
    }]
}];

$scope.add_topic = function () {
    $scope.topic_rows.push({
        executive_pay_ratio: [{
            topic_cd: 't1',
            topic_name: 'topic 1'
        },
        {
            topic_cd: 't2',
            topic_name: 'topic 2'
        },
        {
            topic_cd: 't3',
            topic_name: 'topic 3'
        },
        {
            topic_cd: 't4',
            topic_name: 'topic 4'
        }],
        rate_order_interest: [{
            rate_cd: 'i',
            rate_name: 'important'
        },
        {
            rate_cd: 'm',
            rate_name: 'major'
        }]
    });
};

}

查看

<div ng-controller="MyCtrl">
  <fieldset ng-repeat="topic_row in topic_rows">
        <select id="select_topic_{{$index}}">
            <option ng-repeat="topic in topic_row.executive_pay_ratio" ng-model="currentTopic_rows[executive_pay_ratio]" value="{{topic.topic_cd}}">{{topic.topic_name}}</option>
        </select>
        <select id="select_topic_{{$index}}_value">
            <option ng-repeat="rate in topic_row.rate_order_interest" ng-model="currentTopic_rows.rate_order_interest" value="{{rate.rate_cd}}">{{rate.rate_name}}</option>
        </select>
    </fieldset>
    <a href="" title="Add topic" ng-click="add_topic()">Add topic</a>
</div>

示例:http://jsfiddle.net/97h62/68/

感谢。

1 个答案:

答案 0 :(得分:1)

只需添加例如ng-model="myModel" select$scope.myModel。所选择的选项&#39;价值可以像例如你的控制器中有{{1}}。

更新了您的Fiddle