Question

我的角度控制器中有对象product = {id: "759", name: "someName", category_id: "139", cartridge_type: 2 ...}。

为什么ngOptions中预先选择的选项不起作用？选择呈现空选项，就好像product.cartridge_type为null。

HTML

<select class="form-control"
        id="cartridge_type"
        name="cartridge_type"

        ng-init="product.cartridge_type=product.cartridge_type||cartridgeTypeScope[0]"
        ng-model="product.cartridge_type"
        ng-options="cartridge_type.id as cartridge_type.name for cartridge_type in cartridgeTypeScope">

    <option value="">Select type</option>
</select>

JS

$http.get('someApiPath').success(function(data) {
    $scope.product = data[0];
    console.log( $scope.product );
});

$scope.cartridgeTypeScope = [
    {
        id: 0,
        name  : '-'
    },
    {
        id: 1,
        name  : 'cartridgeType1'
    },
    {
        id: 2,
        name  : 'cartridgeType2'
    }
]

Answer 1

只需在ng-init

中使用cartridgeTypeScope[0].id即可

ng-init="product.cartridge_type=product.cartridge_type||cartridgeTypeScope[0].id"

事实是你正在使用cartridge_type.id as cartridge_type.name期望在select中的id，但是在ng-init中你提供完整的对象（cartridgeTypeScope[0]）。所以它没有选择您的期权价值。

或者你也可以您可以使用相同的ng-init，但可以从cartridge_type.id as

中删除ng-options

ng-init="product.cartridge_type=product.cartridge_type||cartridgeTypeScope[0]"

 ng-options="cartridge_type.name for cartridge_type in cartridgeTypeScope"

希望它有所帮助：）

<强>更新

对于控制器默认选项，您需要执行

  $scope.product={
    "cartridge_type":2
  }

UPADTE 2 ： - 对于$ http： -

Plunker

ng-init的预选选项在ngOptions中不起作用AngularJS

1 个答案: