我有一个select
列表,该列表由填充数组vendors
的API填充。
<select ng-model="po.vendor" ng-options="vendor as vendor.VendorName for vendor in vendors"></select>
然后通过下游的API过程更新 po.vendor
。我的问题是下拉列表没有更新以反映更改。
控制器:
//fill the array so we can populate our dropdown list
$scope.vendors = $scope.vendors || [];
if ($scope.vendors.length < 1) loadExistingVendors();
//load some purchase order by id
getPurchaseOrderById(1);
function getPurchaseOrderById(purchaseOrderId) {
apiService.getPurchaseOrderById(purchaseOrderId).then(function (data) {
//apply po to the model
applyPurchaseOrderModel(data);
}, function (error) {
//blah
});
}
function applyPurchaseOrderModel(data) {
//need to convert c# date to json data
var regex = /-?\d+/;
var match = regex.exec(data.dateRequested);
var date = new Date(parseInt(match[0]));
data.dateRequested = date;
//set the po object to data, data.vendor contains selected vendor info
$scope.po = data;
}
根据我的<pre></pre>
模型输出(po.vendor
)和数组(vendors
),我确实看到它们匹配。但是select元素没有更新以反映这一点。为什么呢?
<h3>po.vendor</h3>
<pre>{{po.vendor | json}}</pre>
<h3>vendors array at the 6 position</h3>
<pre>{{vendors[6] | json}}</pre>
Click here表示<pre>
输出的图片。
答案 0 :(得分:4)
我认为vendor
中的po
对象与vendors
数组中的对象引用不同。我不相信ngOptions使用对象等价逻辑。解决问题的一种方法可能是从vendor
数组中找到匹配的vendors
并将其附加到po
上的function applyPurchaseOrderModel(data) {
//need to convert c# date to json data
var regex = /-?\d+/;
var match = regex.exec(data.dateRequested);
var date = new Date(parseInt(match[0]));
data.dateRequested = date;
//The fix
for (var i=0; i<vendors.length; i++) {
if (angular.equals(vendors[i], data.vendor)) {
vendors[i] = data.vendor;
break;
}
}
//set the po object to data, data.vendor contains selected vendor info
$scope.po = data;
}
上,如下所示:
(请原谅任何盲编码错误)
/^[a-z][\w.-]{1,18}[\w-]$/i
答案 1 :(得分:0)
问题是,当您使用新的po
对象覆盖$scope
时,您正在从data
监视器中断开连接。您要做的是将其所有属性更改为新值,以便在下一个摘要循环期间在视图中更新它们。为此,请替换以下内容:
$scope.po = data;
与
angular.extend($scope.po, data);
或者,如果您需要深层复制
angular.merge($scope.po, data);