AngularJS and Select

AngularJS and Select

本文关键字：Select and AngularJS      更新时间：2023-09-26

我很难理解为什么我的 Angular <select>没有将默认值添加到我想要的类别中。

我有一个从 Parse 中的数据库返回的对象;对象是这样的（这是"选定"选项）：

$scope.item.category = { id: 'uosDHIF', className: 'Category', name: 'Projects' }

我还有一个类别列表：

$scope.categories = [{ id: 'uosDHIF', className: 'Category', name: 'Games' }, { id: 'uosDHIF', className: 'Category', name: 'Random' }, { id: 'uosDHIF', className: 'Category', name: 'Projects' }]

在我的 HTML 中，我有一个这样的选择：

<select name="category" class="form-control mb-10" ng-model="item.category" ng-options="category.name for category in categories"></select>

我可以选择一个新类别并将其分配给该项目，然后我可以使用 item.save（） 保存该项目，但我遇到的问题是所选（ng-model）似乎不起作用，当我第一次进入页面时，即使我在控制台中签入时有类别，我总是得到默认的空白选项。

此外，我

能够使其与我自己创建的简单对象一起使用，但是该对象是从我们在 Parse 中的数据库中返回的，所以我不确定这是问题所在还是我只是在那里缺少一些东西。

谢谢你的帮助。

注意：我已经阅读了与我类似的其他StackOverflow问题，但它们对我的问题没有帮助。

事实上，在ng-options上，你必须指定模型的值（类别为 category.name =>你为ng-model选择类别，但按他的名字显示）。

匹配是通过引用进行的，因此您需要相同的对象（类别：$scope.categories[0]）。

您可以尝试：

.JS

$scope.categories = [
    { id: 'uosDHIF', className: 'Category', name: 'Games' }, 
    { id: 'uosDHIF', className: 'Category', name: 'Random' }, 
    { id: 'uosDHIF', className: 'Category', name: 'Projects' }
];
$scope.item = { 
    category : $scope.categories[0]
};

.HTML

<select name="category" class="form-control mb-10" ng-model="item.category" ng-options="category as category.name for category in categories"></select>

请按如下方式更改 html。希望这是有帮助的。

ng-model="item.category.id" ng-options="category.id as category.name for category in categories">
相关文章：