angularjs - 在编辑项目时在选择下拉列表中设置所选值

时间:2016-01-13 15:31:43

标签: javascript angularjs

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

<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);
    })
    };

3 个答案:

答案 0 :(得分:0)

更改select的ngModel绝对是可行的方法。您可以查看此solution,因为我认为它可以处理同样的问题。

$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>

您能将数据结构样本发送给我们吗?

答案 1 :(得分:0)

好的,如果你真的想把quiz.category保存为数组 首先,当get测验将quiz.category分配给新对象时。 e.g:

$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;

希望它有意义

答案 2 :(得分:0)

在ng-options

中使用“track by”
category as category.name for category in categories track by category.id

工作example