从服务器选择Angular JS中的默认值

Question

这是场景

我正在以这种形式从服务器获取数据

$scope.data=[
{"name":"xyz","status":"pending"},
{"name":"abc","status":"completed"},
{"name":"pqr","status":"completed"}
]

此数据是针对不同状态的单独GET调用

$scope.statusValues=[
{"statusName":"pending","id":"1"},
{"statusName":"completed","id":"2"},
{"statusName":"cancelled","id":"3"},
{"statusName":"custom","id":"4"}
]

在HTML中：-

<div ng-repeat="t in data">{{t.name}}</div>

如何在具有更多$ scope.statusValues的Select方法中显示t.status值

Answer 1

您可以使用ng-options显示所有状态，并可以使用ng-options ng-model绑定到数据状态

 var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { $scope.data = [{ "name": "ABC", "statusId": "1", "status": "completed" }, { "name": "XYZ", "statusId": "2", "status": "pending" }, { "name": "PQR", "statusId": "3", "status": "assigned" }]; $scope.statusValues = [{ "statusId": "1", "status": "completed" }, { "statusId": "2", "status": "pending" }, { "statusId": "3", "status": "assigned" }, { "statusId": "4", "status": "cancelled" }, { "statusId": "5", "status": "customstatus" }, { "statusId": "6", "status": "customstatus2" }]; }); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="myApp" ng-controller="myCtrl"> <div ng-repeat="t in data"> {{t.name}} <select ng-model="t.status" ng-options="s.status as s.status for s in statusValues"></select> </div> </div> 

编辑

更新评论中讨论的数组

Answer 2

使用键值对组合它们。

I have created plunker it may helpful.

柱塞