使用 Angular.JS 设置 <select> 的默认值

Question

假设您有一个长 HTML 表格，其中有一个 select 如下：

<select id="select_id" ng-model="var2model" ng-options="i for i in ['a','b','c','d','e','f','g','h']"></select>

并且在控制器中，您有一个变量 $scope.res，其中存储了一些用于填充表单的数据。如何设置此 select 默认值？我检查了 ng-init 但无法真正让它工作。我试图设置 ng-init="i === res.my_var" 但没有成功。有人可以建议解决这个问题的方法吗？

这是我的控制器的一个片段：

var ctrlRes = controllers.controller('ctrlRes', function ($scope, $location, $window, Patient) {
    $window.document.title = 'Results';

    var path = $location.path().split('/');
    var query = path[path.length - 1];
    Patient.get({id: query}, function(data){
        $scope.res = data;
    });

    $scope.editMode = false;
    $scope.editData = function () {
        console.log('editMode on');
        $scope.editMode = true;
        $scope.my_var = $scope.res.my_var;
    };
});
ctrlRes.$inject = ['$scope', 'Patient'];

Answer 1

在控制器中从 Patient 服务中检索数据后，您应该使用默认值初始化 var2model。

Answer 2

您需要在控制器中为 var2model 设置值：例如：$scope.var2model = 'a'

Answer 3

只需设置 $scope.var2model = 'a' 并删除 ng-init。 Ng-init 还有另一个目标，来自他们的文档：

The only appropriate use of ngInit is for aliasing special properties of ngRepeat, as seen in the demo below. Besides this case, you should use controllers rather than ngInit to initialize values on a scope.

Answer 4

对于 select 输入，您使用 var2model 作为输入模型。因此，为了提供默认值，您必须为该模型对象分配值。
对于 select，为了分配默认值，您必须从用于将值放入 select 选项的数组中分配值。

因此您可以执行以下操作：

    var ctrlRes = controllers.controller('ctrlRes', function ($scope, $location, $window, Patient) {
        $window.document.title = 'Results';

        var path = $location.path().split('/');
        var query = path[path.length - 1];
        Patient.get({id: query}, function(data){
            $scope.res = data;
        });

        $scope.selectArray = ['a','b','c','d','e','f','g','h'];
        var index = $scope.selectArray.indexOf($scope.res.my_var);
        $scope.var2model = $scope.selectArray[index];


        $scope.editMode = false;
        $scope.editData = function () {
            console.log('editMode on');
            $scope.editMode = true;
            $scope.my_var = $scope.res.my_var;
        };
    });
    ctrlRes.$inject = ['$scope', 'Patient'];


    <select id="select_id" ng-model="var2model" ng-options="i for i in selectArray"></select>

使用 Angular.JS 设置 <select> 的默认值

Setting default value for <select> using Angular.JS

html

javascript

angularjs

angularjs-ng-options