我很难理解如何在 ng-repeat 中使用 ng-model。
在此上下文中,CargoItems 是具有 LoadPoint 的对象的列表。 LoadPoint 具有 Id 和 Text 属性。
我想显示绑定到下拉列表中当前选择的文本,但我当然也想跟踪选择了哪个 Id。所以我不确定如何使用 select 绑定更新这两个属性,无论是通过显式使用标签,还是使用我还没有真正弄清楚的 ng-options 。
那么两个问题:
1) 如何正确地将选择列表中的文本和值绑定到 CargoItem.LoadPoint 上的 Id 和 Text 属性?我有一种感觉我的 ng-model 可能是错误的?
2)如何使用 ng-options 默认为所选值?我想出了编写我自己的选项标签的方法,但如果可能的话我想使用 ng-options 。
<div ng-repeat="cargoItem in cargo.CargoItems">
<span>Selected Load Point: {{cargo.LoadPoint.Text}}</span>
<select ng-model="cargoItem.LoadPoint" ng-options="loadPoint.Id as loadPoint.Text for loadPoint in LoadPoints"></select>
</div>
提前致谢!
-
绑定到整个对象引用,而不是使用“Id”属性(loadPoint.Id
)。为此,只需更改ng-options
并删除loadPoint.Id as
part:
<select ng-model="cargoItem.LoadPoint" ng-options="loadPoint.Text for loadPoint in LoadPoints"></select>
-
如果您使用上述方法并正确引用 LoadPoints 对象,Angular 会自动为您执行此操作。以下是有关如何使用直接 LoadPoints 对象引用的示例:
$scope.LoadPoints = [{ Id: '1', Text: 'loadPointA' },{ Id: '2', Text: 'loadPointB' }];
$scope.cargo = {
CargoItems: [{
LoadPoint: $scope.LoadPoints[0]
}, {
LoadPoint: $scope.LoadPoints[1]
}]
};
使用这种方法,cargoItem.LoadPoint
(ngModel)将始终保存对整个 LoadPoints 对象的引用(即{ Id: '1', Text: 'loadPointA' }
),而不仅仅是它的 ID(即'1'
).
jsFiddle: http://jsfiddle.net/bmleite/baRb5/ http://jsfiddle.net/bmleite/baRb5/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)