[英]AngularJS Select List doesnt match selected Item
I have a global controller in my AngularJS application which provides me with a array containing Attendee objects. 我的AngularJS应用程序中有一个全局控制器,该控制器为我提供了一个包含Attendee对象的数组。 Want i want is to modify my CourseRegistration Model which contains one specific attendee object.
我要修改的是包含一个特定与会者对象的CourseRegistration Model。 In the edit window I d like to get a dropdown with all possible attendees whereas there should be the current attendee selected.
在编辑窗口中,我希望下拉菜单中包含所有可能的与会者,而应该选择当前与会者。
I have the following code in my html: 我的html中有以下代码:
<select ng-model="courseRegistration.attendee" ng-options="attendeeSelectItem.name for attendeeSelectItem in attendeeSelectItems"></select>
If I print out courseRegistration.attendee
with JSON.stringify and do the same with the corresponding option they print out the same object (same id, same name etc.). 如果我使用JSON.stringify打印出
courseRegistration.attendee
并使用相应的选项执行相同操作,则它们将打印出相同的对象(相同的ID,相同的名称等)。 But if I do something like ( courseRegistration.attendee == attendeeSelectItem
) for the two identical objects, then I get false. 但是,如果我对两个相同的对象执行类似(
courseRegistration.attendee == attendeeSelectItem
)的操作,那么我会得到错误的结果。
So my question is how can I make sure that the currently selected item (stored in courseRegistration.attendee) gets matched with the corresponding object in my list (which is used by options) ? 所以我的问题是如何确保当前选择的项(存储在courseRegistration.attendee中)与列表中的对应对象(由选项使用)相匹配?
Thanks a lot in advance. 非常感谢。
JSFiddle: http://jsfiddle.net/2ddCy/ JSFiddle: http : //jsfiddle.net/2ddCy/
Greets Marc 马克·马克
Essentially when you use an array of objects to populate a select, it selects the entire object, not just the one item you're seeing in the select list. 本质上,当您使用对象数组来填充选择时,它会选择整个对象,而不仅仅是选择列表中显示的一项。
See this question for detail and example code: Problems when using ng-options and ng-switch together 有关详细信息和示例代码,请参见此问题: 一起使用ng-options和ng-switch时遇到的问题
I'm assuming that you've got something like the following in your controller? 我假设您的控制器中有类似以下内容的东西?
$scope.courseRegistration = {attendee: {id: 2, name: "A Person"}}
If so, the reason the comparison fails is that although the object may have the same properties as the one currently selected, it refers to a different object in memory and therefore isn't classed as equal. 如果是这样,则比较失败的原因是,尽管该对象可能具有与当前选择的对象相同的属性,但它引用了内存中的另一个对象,因此没有被归类为相等。
Now as a quick hack you could stringify them and then compare, however the correct approach would be either to set the current value by key: 现在,作为一个快速技巧,您可以对它们进行字符串化处理然后进行比较,但是正确的方法是要么通过密钥设置当前值:
$scope.courseRegistration = {attendee: attendeeSelectItems[1]};
Or just store the id/name and set your ng-options
condition to bind to just that value: 或者只是存储id / name并设置
ng-options
条件以绑定到该值:
$scope.courseRegistration = {attendee: 1};
<select ng-model="courseRegistration.attendee" ng-options="attendeeSelectItem.id as attendeeSelectItem.name for attendeeSelectItem in attendeeSelectItems"></select>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.