如何设置select语句的值?

时间:2013-02-12 23:46:58

标签: javascript angularjs

http://jsfiddle.net/WcJbu/

当我选择一个人时,我希望favoriteThing选择器显示他们当前的选择。

    <div ng-controller='MyController'>
        <select ng-model='data.selectedPerson' ng-options='person.name for person in data.people'></select>

        <span ...> likes </span>

        <select ... ng-model='data.favoriteThing' ng-options='thing.name for thing in data.things'></select>
    </div>

$scope.data.people = [{
    name: 'Tom',
    id: 1,
    favorite_thing_id: 1
}, {
    name: 'Jill',
    id: 2,
    favorite_thing_id: 3
}];

$scope.data.things = [{
    name: 'Snails',
    id: 1
}, {
    name: 'Puppies',
    id: 2
}, {
    name: 'Flowers',
    id: 3
}];

我是否需要设置服务并添加手表,还是有一种[好]方式直接在select中使用favorite_thing_id?

2 个答案:

答案 0 :(得分:1)

将第二个选择更改为:

<select ng-show='data.selectedPerson' ng-model='data.selectedPerson.favorite_thing_id' 
        ng-options='thing.id as thing.name for thing in data.things'></select>

thing.id as添加到ng-options将允许您根据其ID来选择data.things条目而不是其引用。将ng-model更改为data.selectedPerson.favorite_thing_id会使角度根据selectedPerson.favorite_thing_id自动更改为正确的选项。

jsfiddle http://jsfiddle.net/bmleite/4Qf63/

答案 1 :(得分:0)

http://jsfiddle.net/4Qf63/2/做我想做的事 - 但它非常不满意。

$scope.$watch(function() {
    return $scope.data.selectedPerson;
}, function(newValue) {
    if (newValue) {
        $scope.data.thing = $filter('filter')($scope.data.things, {id: newValue.favorite_thing_id})[0];
    }
})

我希望在select语句中看到所有这些内容。 也许我会尝试写一个指令。 association = {key:matchValue} 所以我可以做到

<select ... ng-model='data.thing' ng-options='t.name for t in data.things' association='{id: "data.selectedPerson.favorite_thing_id"}'></select>