Question

我想知道是否有办法在表格单元格中显示一个id作为另一个对象的另一个名称，因为它们的id彼此对应。

我想要做的是如果有类似的东西以这样的方式显示它？

<td class="tableRowText"><p>{{l.SenderId}}</p></td>

以这种方式。

ng-options="x.ProcessId as x.Name for x in PL"

所以这就像：

<td class="tableRowText"><p>{{l.SenderId}} as x.Name for x in PL</p></td>

一厢情愿！：P希望你们明白我只是想了解我的观点。

提前致谢！

_____________编辑：_______________________________

所以这就是表格以及我如何请求数据。

app.factory('getTableGridDataService', function ($resource, config) {
    return $resource(config.apiURL + '/Logs/GetLogEvents', {}, { 'post': { method: 'POST' } })
});



scope.loggItems = [];
    $scope.fillRealTable = function () {
        var arrayBody = {          
            Sending: $scope.paramSending,
            Receiving: $scope.paramReceiving,
            Logging: $scope.paramLogging,
        };
        var query = postTableGridDataService.post({}, arrayBody);
        query.$promise.then(function (data) {
            var loggItemList = data;
			
            $scope.loggItems = loggItemList
        })
    }

<table class="table table-striped table-condensed table-hover" id="MainTable">
	<thead>
		<tr>
			<th ng-click="sort('SenderId')" style="cursor:pointer;">
				Sender
				<span class="glyphicon glyphicon-sort" ng-show="sortKey=='SenderId'" ng-class="{'glyphicon glyphicon-menu-up':reverse, 'glyphicon glyphicon-menu-down':!reverse}"></span>
			</th>

			<th ng-click="sort('ReceiverId')" style="cursor:pointer;">
				Reciever
				<span class="glyphicon glyphicon-sort" ng-show="sortKey=='ReceiverId'" ng-class="{'glyphicon glyphicon-menu-up':reverse, 'glyphicon glyphicon-menu-down':!reverse}"></span>
			</th>

			<th ng-click="sort('LoggingId')" style="cursor:pointer;">
				Logging source
				<span class="glyphicon glyphicon-sort" ng-show="sortKey=='LoggingId'" ng-class="{'glyphicon glyphicon-menu-up':reverse, 'glyphicon glyphicon-menu-down':!reverse}"></span>
			</th>
		</tr>
	</thead>
	<tbody>
		<tr dir-paginate="l in loggItems.LogEventList|filter:search|orderBy:sortKey:reverse|itemsPerPage:15" pagination-id="mainPagination">

			<td class="tableRowText"><p>{{l.SenderId}}</p></td>
			<td class="tableRowText"><p>{{l.ReceiverId}}</p></td>
			<td class="tableRowText"><p>{{l.LoggingId}}</p></td>
		</tr>
	</tbody>
</table>

我还从我的api中获取另一个对象，其中我有Sending-ID，Reciever-ID和Logging-ID的名称，我希望这些名称显示在表格中，而不是我的对象中显示的ID在表格中。我该如何实现？

具有相应ID和名称的另一个对象：

app.factory('getSearchFormData', function ($resource, config) {
    return $resource(config.apiURL + '/SearchFormObj/getSearchFormItems', {} ,{'get': {method:'GET'}})
});


$scope.SL = [];
function SearchData() {
  var query = getSearchFormData.get();
  query.$promise.then(function (data) {
    $scope.SL = data.SystemList;
    console.log($scope.SL);
  });
};
SearchData()

这是从getSearchFormData返回的对象：

Answer 1

基本思想是在你的控制器中，它依赖于两个服务，你等待两个promises解析，然后遍历你的日志项，并用名称替换id，或者为每个日志项添加名称，如果你想保留ids。

$scope.fillRealTable = function () {
    var arrayBody = {          
        Sending: $scope.paramSending,
        Receiving: $scope.paramReceiving,
        Logging: $scope.paramLogging,
    };
    var p1 = postTableGridDataService.post({}, arrayBody).$promise;
    var p2 = getSearchFormData.get().$promise;

    //it might be $q.all([p1.promise,p2.promise])
    $q.all([p1,p2]).then(function(data1, data2) {
        var loggItemList = data1;
        var SL = data2.SystemList;

        loggItemList.forEach(function (item) {
            item.SenderName = SL[item.SenderId].name;
            item.ReceiverName = SL[item.ReceiverId].name;
            item.LogginName = SL[item.LogginId].name;
        });

        $scope.loggItems = loggItemList;
    });
}

forEach中的代码都是推测，因为你没有提供getSearchFormData返回的数据的结构，所以这个例子假设它的键值为一的对象的键值列表的身份证明E.g：

{
  "A001" : { name: "John Smith" },
  "B001" : { name: "Bruce Wayne" }
}

PS：此方法的替代方法是在getTableGridDataService中移动整个映射并让该服务调用另一个，这意味着您的视图逻辑仍然很简单，因为它将从服务接收完整的结果。

在表格中将ID显示为另一个名称/短语

1 个答案: