问题描述
我以我的初始化页面上的一些输入和选择值发送一个JSON对象。对象持有SHIPTO属性。我想下拉到这个初始值来填充。由于某种原因,它是不填充,即使它们是相同的对象。我甚至在轨道中通过添加,以确保它是基于公司名称测试平等(不完全相信如果多数民众赞成由意味着什么轨道)以下是我有:
JSON对象:
{
账户号码:12345,
电子邮件:空,
公司名称:港灯
无效:假的,
PHONENUMBERS:空,
ChildOfCustomer:00000000-0000-0000-0000-000000000000,
ID:a4aab309-321c-4b09-969c-073eb83b90ad
ModifiedBy:空,
ModifiedOn:2014-07-16T18:46:52.065Z
CreatedBy:空,
CreatedOn:2014-07-16T18:46:52.065Z
请将isDeleted:假的
}
vm.shiptos:
[
{
运送到: {
账户号码:1234,
电子邮件:空,
公司名称:的Mk机械,
无效:假的,
PHONENUMBERS:空,
ChildOfCustomer:00000000-0000-0000-0000-000000000000,
ID:b90f9b8c-3910-43ec-8c14-6294155ce855
ModifiedBy:空,
ModifiedOn:2014-07-15T23:03:58.47Z
CreatedBy:空,
CreatedOn:2014-07-15T23:03:58.47Z
请将isDeleted:假的
},
地址:[],
客户:空,
作业:空,
命令: []
},
{
运送到: {
账户号码:12345,
电子邮件:空,
公司名称:港灯
无效:假的,
PHONENUMBERS:空,
ChildOfCustomer:00000000-0000-0000-0000-000000000000,
ID:a4aab309-321c-4b09-969c-073eb83b90ad
ModifiedBy:空,
ModifiedOn:2014-07-16T18:46:52.065Z
CreatedBy:空,
CreatedOn:2014-07-16T18:46:52.065Z
请将isDeleted:假的
},
地址:[],
客户:空,
作业:空,
命令: []
}
]
在我的HTML的ngoptions语句:
<选择一个id =ddlShiptoNAME =ddlShipto数据-NG-模式=vm.Shipto数据-NG选项=SHIPTO为shipto.ShipTo.CompanyName通过shipto.ShipTo.CompanyName在vm.shiptos轨道SHIPTO级=的形式控制FloatLeft要求>
<选项选择=选择值=> - 选择一个 - < /选项>
< /选择>
不知道按部就班地进行,是不是你要找的东西在这里。
这是NG选项语法使用的是:选择作为标签的数组值
你有错的部分是选择
参数。这个参数的前pression得到核对的模型,以确定它是否匹配(并且会自动设定选择的选项,等等)平等。所以,现在你选择的参数是 SHIPTO
。这意味着,为了默认为一个值,模型需要等于该对象在 vm.shiptos
。
下面是两个选项:
第一个选项是通过 vm.shiptos
循环,你的模型设置为你想默认之一。例如:
angular.forEach($ scope.vm.shiptos,功能(EL,I){
//检查对象对JSON对象并根据需要设置模型对象
如果(el.ShipTo.AccountNumber === jsonObject.AccountNumber){
theModelForNgOptions =报;
}
};
您有第二个选择是改变NG选项选择
参数的对象别的东西,所以该模型并不一定是整个对象。如果账户号码是你的唯一标识这些对象,你可以改变你的选择为:
数据-NG选项=shipto.ShipTo.AccountNumber作为shipto.ShipTo.CompanyName在vm.shiptos SHIPTO
现在,选择将默认只有在连接模式等于 shipto.AccountNumber
。下面是这个工作的例子的jsfiddle:
I am sending a JSON object in order to initialize some input and select values on my page. The object holds a ShipTo property. and I want the dropdown to be populated with this initial value. For some reason it is not populating, even though they are the same object. I even added in a track by to make sure it is testing equality based on the CompanyName (not exactly sure if thats what track by is meant for) Here is what I have:
the JSON Object:
{
"AccountNumber": "12345",
"Email": null,
"CompanyName": "HK Electric",
"Inactive": false,
"PhoneNumbers": null,
"ChildOfCustomer": "00000000-0000-0000-0000-000000000000",
"Id": "a4aab309-321c-4b09-969c-073eb83b90ad",
"ModifiedBy": null,
"ModifiedOn": "2014-07-16T18:46:52.065Z",
"CreatedBy": null,
"CreatedOn": "2014-07-16T18:46:52.065Z",
"IsDeleted": false
}
vm.shiptos :
[
{
"ShipTo": {
"AccountNumber": "1234",
"Email": null,
"CompanyName": "Mk Mechanical",
"Inactive": false,
"PhoneNumbers": null,
"ChildOfCustomer": "00000000-0000-0000-0000-000000000000",
"Id": "b90f9b8c-3910-43ec-8c14-6294155ce855",
"ModifiedBy": null,
"ModifiedOn": "2014-07-15T23:03:58.47Z",
"CreatedBy": null,
"CreatedOn": "2014-07-15T23:03:58.47Z",
"IsDeleted": false
},
"Addresses": [],
"Customer": null,
"Job": null,
"Orders": []
},
{
"ShipTo": {
"AccountNumber": "12345",
"Email": null,
"CompanyName": "HK Electric",
"Inactive": false,
"PhoneNumbers": null,
"ChildOfCustomer": "00000000-0000-0000-0000-000000000000",
"Id": "a4aab309-321c-4b09-969c-073eb83b90ad",
"ModifiedBy": null,
"ModifiedOn": "2014-07-16T18:46:52.065Z",
"CreatedBy": null,
"CreatedOn": "2014-07-16T18:46:52.065Z",
"IsDeleted": false
},
"Addresses": [],
"Customer": null,
"Job": null,
"Orders": []
}
]
The ngoptions statement in my HTML:
<select id="ddlShipto" name="ddlShipto" data-ng-model="vm.Shipto" data-ng-options="shipto as shipto.ShipTo.CompanyName for shipto in vm.shiptos track by shipto.ShipTo.CompanyName" class="form-control FloatLeft" required>
<option selected="selected" value="">--Select One--</option>
</select>
Not sure track by is not what you're looking for here.
This is the ng-options syntax you are using: select as label for value in array
The part you have wrong is the select
parameter. This parameter's expression gets equality checked against the model to determine if it is a match (and will automatically set selected option, etc). So, right now your select parameter is shipto
. This means that in order to default to a value, your model needs to be equal to the object in vm.shiptos
.
Here's two options:
The first option is to loop through the vm.shiptos
and set your model to the one you would like to default. eg:
angular.forEach($scope.vm.shiptos,function(el,i){
//check objects against the JSON object and set the model to the object if desired
if (el.ShipTo.AccountNumber === jsonObject.AccountNumber){
theModelForNgOptions = el;
}
};
The second option you have is to change the ng-options select
parameter to something else on the object, so that the model doesn't have to be the whole object. If AccountNumber is your unique identifier to those objects, you could change your options to:
data-ng-options="shipto.ShipTo.AccountNumber as shipto.ShipTo.CompanyName for shipto in vm.shiptos
Now, the select will default only if the attached model is equal to shipto.AccountNumber
. Here is an example jsfiddle of this at work: http://jsfiddle.net/ADukg/5392/
这篇关于角NG-选项中选择不被设置为初始值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!