Javascript AngularJS在使用值作为值语法时选择不绑定
我正在尝试使用AngularJS创建一个Select标记。我正在使用ngOptions和ngModel进行数据绑定 现在:假设我有如下数据源:Javascript AngularJS在使用值作为值语法时选择不绑定,javascript,angularjs,data-binding,Javascript,Angularjs,Data Binding,我正在尝试使用AngularJS创建一个Select标记。我正在使用ngOptions和ngModel进行数据绑定 现在:假设我有如下数据源: $scope.doesNotBind=[ {ID:12,标题:“12-不绑定”}, {ID:14,标题:“14-不具有约束力”}, ]; $scope.doesNotBindModel={ID:14,标题:“14-不绑定”} 它没有绑定,因为两者是两个不同的对象 创建对象时,会为其分配单独的内存位置 var a = {}; var b = {};
$scope.doesNotBind=[
{ID:12,标题:“12-不绑定”},
{ID:14,标题:“14-不具有约束力”},
];
$scope.doesNotBindModel={ID:14,标题:“14-不绑定”}代码>
它没有绑定,因为两者是两个不同的对象
创建对象时,会为其分配单独的内存位置
var a = {};
var b = {};
如果您检查a===b
,它将返回false。因为两者都是两个不同的对象
这就是原因
$scope.doesNotBindModel = {ID: 57, Title: "57 - Does not bind"};
不绑定
$scope.doesBindModel = $scope.doesBind[3];
因为在后面的例子中,您是根据同一对象的索引引用该对象。ngModel
通过引用而不是值进行比较。因此,如果您在doesNotBind中使用ng options=“value as value.Title for value”
,则您的doesNotBind模型必须是:
JavaScript:
$scope.doesNotBindModel = $scope.doesNotBind[1];
$scope.values = [{
id: 1,
label: 'aLabel',
subItem: { name: 'aSubItem' }
}, {
id: 2,
label: 'bLabel',
subItem: { name: 'bSubItem' }
}];
$scope.selected = { name: 'aSubItem' };
但是,如果您仍然希望在JSON表示法中设置doesNotBindModel
,则可以向ng options
表达式添加track by value.ID
,如下所示:
HTML:
JavaScript:
$scope.doesNotBindModel = $scope.doesNotBind[1];
$scope.values = [{
id: 1,
label: 'aLabel',
subItem: { name: 'aSubItem' }
}, {
id: 2,
label: 'bLabel',
subItem: { name: 'bSubItem' }
}];
$scope.selected = { name: 'aSubItem' };
出于保留选择的目的,track by
表达式始终应用于数据源的元素(本例中为项
)。要计算是否选择了某个元素,请执行以下操作:
对数组中的元素应用track by
。在示例中:[1,2]
将track by
应用于ngModel
中已选择的值
在示例中:这是不可能的,因为track by
指的是item.id
,但是从ngModel
中选择的值是{name:'aSubItem'}
。因此,track by
表达式应用于错误的对象,无法找到所选元素<代码>
始终重置为“未选择”选项
活生生的例子:根据你最近的编辑更新了答案是的是的,我完全意识到这个问题就是你上面写的问题。我在寻找解决这个问题的方法。可能解决方法是在绑定时获取对对象的引用。我想这是唯一的逻辑解决方案。解决方法是什么?如果要在选择框中预选特定选项,可以使用ng init或必须使用数组索引方式来设置特定项。可以使用ng init并调用函数。在那里,您可以检查特定条件,并将特定项目设置为在ng modelFair中选择的项目。对于我的问题,我可以在通过获取数据后设置它。干杯,嗨。谢谢你的回答。我正在阅读文档,偶然发现了trackby表达式。为什么不推荐呢?他们说不要将它与select as结合起来,仅此而已。我已经经历了这一切。示例:@AlbertHerd我已经更新了我的答案,以说明为什么angular的doc说“不要在同一表达式中使用select as和track by”。他们不是为了一起工作而设计的。谢谢你的评论。我进一步以我的例子创建了一个POC。我将ng模型设置为数据源中确实存在的值,但不引用它。通过删除“选择为”表达式并添加“轨迹依据”,它将成功运行。事实上,doc说不要将select as与track by组合,因为它们已经消除了。例子: