Question

我正在尝试以编程方式从我的控制器更新所选项目，但它无法正常工作。当我单击提交按钮时，它所做的只是清除选择。我期望第二个选项（珀斯）被选中。

请查看此plunker了解更多信息。 http://jsfiddle.net/ky5F4/

由于

<div ng-controller="MyController" ng-app>
    <div>Number of datasets= {{datasets.length}}</div>
    <div>
        <select class="dataset" size="1" ng-model="selectedDataset">
            <option ng:repeat="dataset in datasets" value="{{dataset.name}}">
                <h3>{{dataset.name}}</h3>
            </option>
    </div>
    <input type="button" value="submit" ng-click="Select()"></input>
</div>

function MyController($scope) {
    $scope.datasets = [{
        id: 'id-1',
        name: 'Brisbane'
    }, {
        id: 'id-2',
        name: 'Perth'
    }, {
        id: 'id-3',
        name: 'Melbourne'
    }];

    $scope.selectedDataset = 'id-1';

    $scope.Select = function () {
        alert('testing');
        $scope.selectedDataset = 'id-2';
    }
}

Answer 1

使用ng-options代替ng-repeat。

<select class="dataset" size="1" ng-model="selectedDataset" 
    ng-options="dataset.id as dataset.name for dataset in datasets">

Working fiddle

您可以看到文档here

模型更新时，AngularJs选择不更新

1 个答案: