【问题标题】:Selecting `<option>` value from controller for `<select ng-options>`从控制器中为 `<select ng-options>` 选择 `<option>` 值
【发布时间】:2020-02-26 14:23:18
【问题描述】:
<select
      class="form-control input-md
      availabiltyDatesInput pull-left"
      name="statusModel"
      autocomplete="off"
      id="statusModel"
      ng-options="alertStatus.value as alertStatus.text for alertStatus in alertStatuses"
      ng-model="statusModel">
 </select>

我有一个带选项的 Select。我需要预先填充此选择的值。

我正在尝试在控制器中设置 ng-model:

angular.module("app.alerts")
.controller("alertsCtrl", function ($scope, CarmateCommonApiSvc, $uibModal) {

     getLookupsData();

     var alertStatuses = [];

     function getLookupsData() {
        alertStatuses = [];

        CarmateCommonApiSvc.getLookups().then(function (res) {
            if (res.code != 0) return;
            _.each(res.data.allLookups, function (item, index, arr) {

                if(item.name == 'AlertStatus'){
                    alertStatuses.push(item);
                }
            });
            $scope.alertStatuses = alertStatuses;                
            $scope.statusModel = alertStatuses[0];
        })
     }
});

但它不起作用。 我是 AngularJs 的新手

【问题讨论】:

    标签: javascript angularjs ng-options


    【解决方案1】:

    您需要使用如下值设置 ng-model:

    $scope.statusModel = alertStatuses[0].value;
    

    欲了解更多信息和示例,请点击此处:link

    也许你应该先检查数组是否有任何项目:

    if(alertStatuses.length > 0){
        $scope.statusModel = alertStatuses[0].value;
    }
    
    

    【讨论】:

      【解决方案2】:

      statusModel 只能设置为单个值,而不是完整对象alertStatuses[0]。所以,更新你的代码:

      $scope.statusModel = alertStatuses[0].value || 0;
      

      【讨论】:

        【解决方案3】:

        您实际上可以滥用ng-init 指令。

        <select
          class="form-control input-md availabiltyDatesInput pull-left"
          name="statusModel"
          autocomplete="off"
          id="statusModel"
          ng-options="alertStatus.value as alertStatus.text for alertStatus in alertStatuses"
          ng-model="statusModel"
          ng-init="statusModel = alertStatuses[0]"
        >
        </select>
        

        【讨论】:

        • 当 AngularJS 团队不推荐时,为什么建议人们滥用 ng-init 指令? ng-init 代码的值也是错误的,因为 ng-option 指定了 alertStatus.value as alertStatus.text for alertStatus
        • 我注意到另一种实现 OP 要求的方法。我也确实提到这是对指令的滥用。不管它是不是滥用,这是一个应该承认的可行方法。我同意分配的值是错误的。
        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2014-07-04
        • 2016-08-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2016-07-02
        • 1970-01-01
        相关资源
        最近更新 更多