使用 AngularJS、从 WCF Rest 服务返回的值填充下拉列表

Question

下面是我的 JSON 对象 Ctrlr.status 值

"[{\"Key\":\"8\",\"Value\":\"Auto\",\"Tid\":\"Date(-62135596800000)\",\"Uid\":null},{\"Key\":\"2\",\"Value\":\"Pending\",\"Tid\":\"Date(-62135596800000)\",\"Uid\":null},{\"Key\":\"4\",\"Value\":\"Resolution\",\"Tid\":\"Date(-62135596800000)\",\"Uid\":null},{\"Key\":\"6\",\"Value\":\"Resolve\",\"Tid\":\"Date(-62135596800000)\",\"Uid\":null}]"

我的下拉列表应该有值 Auto、Pending、Resolution、Resolve。

下面是我的代码显示下拉列表

<select ng-model="gridCtrl.add.Rejection.status" ng-required="true"
                            options="s.value for s in Ctrlr.status"/>

但是它显示的是空列表。请指出我的错误并告诉我如何填充这些值。提前致谢

Answer 1

我首先将您的 JSON 数组分配给作用域上的一个变量，如下所示：

$scope.statuses = [{\"Key\":\"8\",\"Value\":\"Auto\",\"Tid\":\"Date(-62135596800000)\",\"Uid\":null},{\"Key\":\"2\",\"Value\":\"Pending\",\"Tid\":\"Date(-62135596800000)\",\"Uid\":null},{\"Key\":\"4\",\"Value\":\"Resolution\",\"Tid\":\"Date(-62135596800000)\",\"Uid\":null},{\"Key\":\"6\",\"Value\":\"Resolve\",\"Tid\":\"Date(-62135596800000)\",\"Uid\":null}]

然后你可以用

遍历它

ng-options

类似于

ng-options="status.Key as status.Value for status in statuses"

查看工作插件 here

使用 AngularJS、从 WCF Rest 服务返回的值填充下拉列表

Populate dropdownlist using AngularJS, values returned from WCF Rest Service

html

wcf

angularjs