wie man die columnNames zu Tabellendaten abbildet und nur diese Daten in uigrid anzeigt

Question

Ich bekomme columnNames dynamisch mit Objekt innerhalb einer Eigenschaft, ich möchte nur nur die Eigenschaft zeigen, die innerhalb dieses Objekts ist.

das ist mein columnNames

$scope.columnNames=[ 
{"field":"firstName"}, 
{"field":"lastName"}, 
{"field":"id"},//i can get "id" or "name" or anything it comes dynamically 
{"field":"employed"} 
]; 

und ich bekomme die Daten wie diese $scope.gridOptions.data = [ { "firstName": "Cox", "lastName": "Carney", "id": "{'id':'1','name':'Syed'}", "employed": true }, { "firstName": "Lorraine", "lastName": "Wise", "id": "{'id':'2','name':'Rasheed'}", "employed": false }, { "firstName": "Nancy", "lastName": "Waters", "id": "{'id':'3','name':'Emir'}", "employed": false } ];

, wenn ich diesen laufen ist immer das ganze Objekt "{'id':'3','name':'Emir'}" in id Spalt, aber ich möchte nur, dass die ID-Eigenschaft Wert Zeige in dieser Spalte. und dies ist mein Plunker ist http://plnkr.co/edit/AMeTxuMMBmfVt9f0t7HZ?p=preview

Answer 1

Sehen Sie diese plnkr

den folgenden Code hinzugefügt, um die ID von json zu id-Feld

angular.forEach($scope.gridOptions.data, function(value, key) { 
    var parsedId = angular.fromJson(value.id.replace(/'/g, '"')); 
    value.id = parsedId.id; 
    }); 

auch wie Ihr json scheint, 'delemited, zu analysieren, anstatt " , also musste ich die Zeichenfolge ersetzen, so dass JSON geparst werden konnte, aber wenn Sie den richtigen JSON-Formularserver bekommen, müssen Sie das nicht tun. Hoffen, dass das hilft

Answer 2

Versuchen Sie mit cellTemplate in $scope.columnNames.

Fügen Sie einfach cellTemplate: '<span>{{COL_FIELD[col.field] zu $scope.columnNames wie folgt aus:

$scope.columnNames=[ 
     {"field":"firstName"}, 
     {"field":"lastName"}, 
     {"field":"id", cellTemplate: '<span>{{COL_FIELD[col.field]}}</span>'}, //this cellTemplate works for "id" or "name" or anything 
     {"field":"employed"} 
    ]; 

Da Sie $scope.columnNames dynamisch erhalten, Sie Celltemplate wie folgt hinzufügen:

$scope.columnNames[2].cellTemplate='<span>{{COL_FIELD[col.field]}}</span>'; 

Sehen Sie diese plnkr