AngularJS在调用rest式服务和作用域对象更新后选择值丢失
AngularJS Select Value Being Lost After Call to Restful Service and Scope Object Update
我有一个使用ASP.net Web API后端的angularjs前端。我使用下面的代码为我的选择列表:
<select id="package" class="form-control" ng-options="package as package.Name for package in request.PackageServices.Packages" ng-model="request.Package">
<option value="">No Package</option>
</select>
选择列表正确填充,并按预期输出包。
在选择更改时,请求。包项使用选择的包正确更新。
在将请求对象发布到Web API restful服务时,它正确地包含了正确的包。
web api向客户端发送restful响应时,请求对象包含正确的包。
问题在于,在调用API服务并且API服务响应返回新的请求对象之后,选择列表失去了正确的选择值。
下面是saverrequest方法的样子:
$scope.saveRequest = function (request) {
console.log(request);
//the request.Package contains the correct Package here!
applicantLinkData.create(request)
.$promise.then(
function (resp) {
$scope.request = resp.Request;
console.log(resp.Request);
// the resp.Request.Package contains the right package here!
},
function (resp) {
//failure... do something
}
);
};
我不知道如何解决这个问题,但基本上在saveRequest方法被调用后,html中的选择列表重置回"no Package",而不是保留正确选择的包。
你有两个选择:
- 不要替换整个请求,这会导致angular失去对对象引用的跟踪。您需要一个字段一个字段地复制。
- 给你的包分配一个Id,并在你的
ng-options
中使用通过Id跟踪,而不是通过对象引用跟踪。ng-options="package as package.Name for package in request.PackageServices.Packages track by package.Id"
相关文章:
- JavaScript:更新<选择>给定月份输入的天数列表
- 如何动态更新选择值
- 由其他Ember Select填充的Ember Select不更新选择绑定
- Meteor AutoForm:如何基于其他控件更新选择选项
- 在更新选择器中使用$in时颠倒多个文档
- 使用jQuery更新选择的多个字段的数量
- 使用js使html按钮更新选择标记onchange函数
- 如何使用jQuery更新选择选项下拉菜单
- 根据滚动位置更新选择菜单中的选定选项
- 代码镜像 - 更新选择
- 尝试从 jQuery 帖子结果更新选择列表选项
- 从 jquery ajax json 响应更新“选择”框中的选项值
- 使用 SQL 信息更新选择下拉列表 (HTML)
- 使用 jQuery 或 Javascript 自动更新选择选项列表
- 在更改另一个选择输入时更新选择输入
- 在 Meteor 中使用复杂的更新选择器进行原子操作
- AngularJS如何使用ng选项更新选择框中的嵌套模型
- D3 将更新选择限制为具有实际更改的条目
- jQuery Chosen-在不丢失选择的情况下更新选择列表
- 根据另一个选择更新选择菜单