Question

我有以下数组：

$scope.array = [{value: ['a'], name: 'A'}, {value: ['a', 'b'], name: 'A/B'}, {value: ['a', 'b', 'c'], name: 'ABC' }];

我想在我的html中添加一个select来加载数组中的数据。关键是我想把选项的值作为键value的值，但它没有正确选择默认选项。

<select class="form-control" ng-options="element as element.name for element in array track by element.value" ng-model="form.element"></select>

当我启动应用程序时，我用于ng-model的对象如下所示：

$scope.form = {element: ['a'], otherField: 'test'}

所以它应该选择数组的第一个元素作为默认值，但它不起作用。

你可以在这里找到小提琴：Fiddle

Answer 1

选项框需要包含您尝试选择的项目。由于您将参考对象放入选项框中，因此您的选项框必须包含与您希望默认选择的项目具有相同参考的项目。

我已在fiddle

中更新了JS

这是新的JS

function Controller($scope) {
    $scope.array = [{value: ['a'], name: 'A'}, {value: ['a', 'b'], name: 'A/B'}, {value: ['a', 'b', 'c'], name: 'ABC' }];

    $scope.form = {element: $scope.array[0]}
}

Answer 2

当您使用ng-options指令时，该对象将包含所选对象的原型（在您的情况下）属性name和属性{value: ['a'], name: 'A'}

在您的示例中，例如：$scope.form = {element: {value: ['a'], name: 'A'}}

所以要做的第一件事就是使用具有此形状的对象设置ng-model，以便能够选择默认值：

ng-options

然后，value中的语法跟踪将定义您选择的默认值。

您不能在示例中使用属性ng-options，因为它是一个数组而ng-options不知道如何比较数组。 <select class="form-control" ng-options="element as element.name for element in array track by element.name" ng-model="form.element"></select>可以通过以下方式定义默认值：id，number或string。

我建议您使用类似名称的属性（或者如果您愿意，可以创建一个ID），例如ng-options将能够确定默认值

<RatingBar
android:id="@+id/rating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:numStars="5"
android:stepSize="0.1"
style = "?android:attr/ratingBarStyleSmall"/>

只有两次更改，您的默认选择才会运行

选择ng-options和array作为值

2 个答案: