使用Angular.JS设置的默认值

时间:2022-04-26 19:44:37

Suppose you have a long HTML form and in which you have a select as follow:

假设您有一个很长的HTML表单,并且您有一个选择如下:

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

and in the controller you have a variable $scope.res in which store some data to populate the form with. How to set this select default value? I checked the ng-init but couldn't really have it to work. I tried to set ng-init="i === res.my_var" but no luck. Could someone kindly suggest an approach to solve this?

并且在控制器中你有一个变量$ scope.res,其中存储了一些数据来填充表单。如何设置此选择默认值?我检查了ng-init,但实际上无法工作。我试着设置ng-init =“i === res.my_var”,但没有运气。有人可以建议一种方法来解决这个问题吗?

Here is a snippet from my controller:

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

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'];

4 个解决方案

#1


2  

  1. For select input you are using var2model as model of the input. So for providing default value you have to assign value to this model object.

    对于选择输入,您使用var2model作为输入的模型。因此,要提供默认值,您必须为此模型对象赋值。

  2. For select, in order to assign the default value you have to assign value from array you are using to put values in select options.

    对于select,为了分配默认值,您必须从用于在选择选项中放置值的数组中指定值。

So you can do the following:

所以你可以做到以下几点:

    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>

#2


3  

You need set value for var2model in your controller: Ex: $scope.var2model = 'a'

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

#3


1  

In controller after retrieving data from Patient service you should initialize var2model with default value.

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

#4


0  

Just set $scope.var2model = 'a' and remove ng-init. Ng-init has another goal, from their docs:

只需设置$ 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.

ngInpe的唯一合适用途是用于别名ngRepeat的特殊属性,如下面的演示所示。除了这种情况,您应该使用控制器而不是ngInit来初始化作用域上的值。

#1


2  

  1. For select input you are using var2model as model of the input. So for providing default value you have to assign value to this model object.

    对于选择输入,您使用var2model作为输入的模型。因此,要提供默认值,您必须为此模型对象赋值。

  2. For select, in order to assign the default value you have to assign value from array you are using to put values in select options.

    对于select,为了分配默认值,您必须从用于在选择选项中放置值的数组中指定值。

So you can do the following:

所以你可以做到以下几点:

    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>

#2


3  

You need set value for var2model in your controller: Ex: $scope.var2model = 'a'

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

#3


1  

In controller after retrieving data from Patient service you should initialize var2model with default value.

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

#4


0  

Just set $scope.var2model = 'a' and remove ng-init. Ng-init has another goal, from their docs:

只需设置$ 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.

ngInpe的唯一合适用途是用于别名ngRepeat的特殊属性,如下面的演示所示。除了这种情况,您应该使用控制器而不是ngInit来初始化作用域上的值。