angularjs-编辑项目时,在选择下拉菜单中设置所选值

angularjs -Setting the selected value in a select dropdown when editing an item

本文关键字:设置 下拉菜单 选择 项目 编辑 angularjs-      更新时间:2023-09-26

编辑项目时,如何设置下拉列表的选定值?

<div class="form-group">
    <label for="category" class="col-sm-2 control-label">Category</label>
    <div class="col-sm-10">
        <select ng-model="quiz.category" ng-options="category as category.name for category in categories" required>
            <option></option>
        </select>
    </div>
</div>

当我点击编辑时

$scope.editQuiz = function(quiz)
    {   
        $scope.quiz = {};
        $scope.quiz.name = quiz.name // this works fine
        $scope.quiz.category = quiz.category[0]; // ?????
        console.log($scope.quiz.category);
        //$scope.quiz = quiz;  
    }

获取类别的方法:

$scope.getCategories = function() {
    $http.get('http://localhost/myappi/API/index.php/Api/categories').
        success(function(data) {
            $scope.categories = data;   
        })
        .error(function(err) {
        console.log('error',err);
    })
    };

如果你真的想把quiz.classification作为一个数组,那就好了
首先,当您get时,测验会将quiz.category分配给一个新对象。例如:

$scope.tmp = { category: quiz.category[0] };

我们必须这样做,因为quiz.category是一个数组,但ng-options的值是一个对象。

现在我们可以将var绑定到这样的选项:

<select ng-model="tmp.category" ng-options="category as category.name for category in categories" required>
        <option></option>
</select>

最后,在您的函数中,您将旧值替换为新值:

$scope.quiz.category[0] = tmp.category;

希望这是有意义的

更改select的ngModel无疑是一条不错的路。你可以看看这个解决方案,因为我相信它能解决同样的问题。

$scope.options = [{ name: "a", id: 1 }, { name: "b", id: 2 }]; $scope.selectedOption = $scope.options[1];

<select data-ng-options="o.name for o in options" data-ng-model="selectedOption"></select>

你能把你的数据结构样本发给我们吗?

在ng选项中使用"track by"

category as category.name for category in categories track by category.id

工作示例