javascript - Angular - 选择框 - 从 Controller 设置选定条目

Question

我有一个选择框，定义如下:

 <select ng-model="selectedSupplier" ng-options="supplier.name for supplier in suppliers">
 </select>

在我的 Controller 中，我有一个按钮，尽管它没有做任何有用的事情，但可以用来解释我在 Controller 中更改所选值时遇到的问题:

执行该函数时，设置选择框中的选项，设置选中的选项:

$scope.foo = function() {
    var foos = [{"id":1,"name":"No 1"},{"id":2,"name":"No 2"},{"id":3,"name":"No 3"},{"id":4,"name":"No 4"}];
    $scope.suppliers = foos;
    $scope.selectedSupplier = foos[2];
}

但是我把函数改成这样了，还是设置了选项，但是选中的选项是一个新的空白选项，不是我定义的:

$scope.foo = function() {
    var foos = [{"id":1,"name":"No 1"},{"id":2,"name":"No 2"},{"id":3,"name":"No 3"},{"id":4,"name":"No 4"}];
    $scope.suppliers = foos;
    $scope.selectedSupplier = {"id":3,"name":"No 3"};
}

这是怎么回事？如何使用原始对象以外的对象设置所选选项？

Answer 1

这是一个平等/身份问题。字面的

 $scope.selectedSupplier = {"id":3,"name":"No 3"};

与您的 foos 数组中的对象不同。尽管它们包含相同的数据，但它们是 2 个不同的引用。

$scope.selectedSupplier === foos[2] // false

您在第一个示例中正确引用了数组中的对象。

$scope.selectedSupplier = foos[2];