ng Option 默认选中的选项

Question

如何在 select 框中设置默认选项...我尝试了几个选项但没有得到它

我尝试使用来自 json:

的对象的值在我的 contrador 上创建一个范围

像这样：

$scope.productSelect = $scope.item[0];

这是我的代码：

html:

<select id="variant" class="form-control variant-select"
        ng-model="productSelect"
        ng-options="product as product.formattedPrice+' - '+product.variantQualifierName for product in item[0] track by product.url">

JS:

(function (){

  'use strict';

  /**
   * @ngdoc function
   * @name variantApp.controller:AppCtrl
   * @description
   * # AppCtrl
   * Controller of the variantApp
   */

   var app = angular.module('variantApp.product.variantCtrl', []);

   app.controller('AppCtrl',
    [
      '$scope',
      'ProductVariant',
      '$log',
      function ($scope, ProductVariant, $log){

      $scope.item = [
        ProductVariant.getData()
      ];

     $scope.productSelect = $scope.item[0];

     $log.info($scope.productSelect);


   }]);

})(window, angular);

Answer 1

你有 ng-options="product as product.formattedPrice+' - '+product.variantQualifierName for product in item[0] track by product.url" 并且 $scope.productSelect = $scope.item[0];

因此，您要么尝试 select 一个选项，要么将您的 productSelected 初始化为同一数组。

Answer 2

你想要什么？要显示默认选项，请使用

<select id="variant" class="form-control variant-select"
        ng-model="productSelect"
        ng-options="product as product.formattedPrice+' - '+product.variantQualifierName for product in item[0] track by product.url">
<option value="">Default</option>
</select>

或者仅显示默认选择值然后使用：

ng-selected="EXPRESSION"。喜欢

<select id="variant" class="form-control variant-select"
        ng-model="productSelect"
        ng-options="product as product.formattedPrice+' - '+product.variantQualifierName for product in item[0] track by product.url" ng-selected="$first">

显示所选的第一个值

Answer 3

 $scope.item = [
    ProductVariant.getData()
  ];

 $scope.productSelect = $scope.item[0];

如果 ProductVariant.getData() 是一个承诺（异步调用），那么 $scope.item[0]; 也可以在调用 $scope.productSelect = $scope.item[0]; 的阶段未定义。

尽管正如其他人提到的，还有一个奇怪的事实，即您只重复项目列表中的第一个索引：product in item[0]

Answer 4

感谢您的帮助。

在 firebug 和你们每个人的帮助下，特别是 skubski 我已经解决了

我所做的改变：

<select id="variant" class="form-control variant-select"
        ng-model="productSelect"
        ng-options="product as product.formattedPrice+' - '+product.variantQualifierName for product in item[0] track by product.url">
</select>

为此：

<select id="variant" class="form-control variant-select"
        ng-model="productSelect"
        ng-options="product as product.formattedPrice+' -     '+product.variantQualifierName for product in item track by product.url">
</select>

和

$scope.item = [
    ProductVariant.getData()
  ];

 $scope.productSelect = $scope.item[0];

为此：

$scope.item = ProductVariant.getData();
$scope.productSelect =  $scope.item[0];

通过这些更改，我发现其中一个产品被默认选中。

ng Option 默认选中的选项

ngOption default selected option

angularjs

angular-ngmodel

angular-services

angularjs-ng-options