如何設置角度的組合框初始值？

Question

如果要設置組合框的值，請嘗試以下操作：

控制器代碼：

 $scope.streettypeMockData = [{
    name: 'Street',
    value: 'Street'
  }, {
    name: 'Avenue'
  }, {
    name: 'Crescent'
  }, {
    name: 'Drive'
  }, {
    name: 'Road'
  }, {
    name: 'Highway'
  }];

  var sel = "Street";
  var selectedValue = {
    name: sel
  };
  $scope.streetTypeSelected = selectedValue;

誰能告訴我為什么這不起作用？ 另請參見http://plnkr.co/edit/4ISL8A1cNGCtafsc0leX?p=preview

Answer 1

您可以像這樣簡單地使用ng-init

<select ng-init="streetTypeSelected = streettypeMockData[0]" class="form-control" ng-model="streetTypeSelected" ng-options="streetType.name for streetType in streettypeMockData">
  </select>

工作演示

您也可以如下所示執行“贊”

var app = angular.module('myApp', []);
app.controller('MainCtrl', function ($scope) {
     $scope.streettypeMockData = [
        {name: 'Street', value: 'Street'},
        {name: 'Avenue'},
        {name: 'Crescent'},
        {name: 'Drive'},
        {name: 'Road'},
        {name: 'Highway'}
    ];
    $scope.streetTypeSelected = $scope.streettypeMockData[0];
});

工作演示

也看看這個

https://docs.angularjs.org/api/ng/directive/select

Answer 2

該代碼有幾個問題：

• ng-options選擇名稱，而ng-model指向對象。 最好streetType as streetType.name for streetType in streettypeMockData使用streetType as streetType.name for streetType in streettypeMockData來選擇整個對象。
• 在這種情況下，初始值將不被接受，因為Angular會嘗試通過引用比較對象。 使用track by 。

完整的<select>應該是：

    <select class="form-control" ng-model="streetTypeSelected"
      ng-options="streetType as streetType.name for streetType in streettypeMockData track by streetType.name">

見叉車 。