在JavaScript中獲取對象屬性

Question

我有一個來自API這樣的get請求的對象：

var object = {
  "number": 0,
  "size": 9999,
  "totalPages": 0,
  "numberOfElements": 1,
  "totalElements": 1,
  "content": [{
    "id": 26,
    "name": "New York",
    "acronym": "SP",
    "country": {
      "id": 33,
      "name": "United States",
      "acronym": "US"
    }
  }]
}

如果要獲取國家/地區名稱，則需要執行以下操作：

object.content[0].country.name or object["content"][0]["country"]["name"]

但是，我試圖通過ng重復訪問我在控制器中傳遞的那些屬性，以便概括我的控制器。

在控制器內部，我有：

$scope.$parent.fields = ["acronym", "name", "country.name"];
$scope.columns = [
  {
    field: $scope.fields[0],
    "class": 'col-sm-1'
  }, {
    field: $scope.fields[1],
    "class": 'col-sm-5'
  }, {
    field: $scope.fields[2],
    "class": 'col-sm-3'
  }
];

和HTML：

<tr ng-repeat="item in elements.content">
  <td ng-repeat="column in columns">{{ item[column.field] }}</td>
  <td id="op">
    <button class="btn btn-xs btn-success" ng-click="preview(item)">
      <i class="fa fa-eye"></i> View
    </button>
    <button class="btn btn-xs btn-primary" ng-click="update(item)">
      <i class="fa fa-pencil"></i> Edit
    </button>
    <button class="btn btn-xs btn-danger" ng-click="remove(item)">
      <i class="fa fa-trash"></i> Delete
    </button>
  </td>
</tr>

它僅適用於內容對象的屬性，不適用於內容內部對象的屬性。 我能做什么？

預先感謝您的時間和幫助！

Answer 1

您可能需要創建一個輔助函數，該函數解析作為鍵傳遞的字符串並返回對象的值，因為您無法使用字符串訪問對象的子屬性：

var item = {
  property: {
    child: 'somevalue'
  }
}

// this will return undefined
item['property.child']

幸運的是， 這個不錯的功能存在：

function getDescendantProp(obj, desc) {
  var arr = desc.split(".");
  while(arr.length && (obj = obj[arr.shift()]));
  return obj;
}

它接受一個對象和一個字符串，將字符串轉換成數組，並遍歷傳入對象的屬性，直到到達要搜索的屬性。 它適用於任何深度的對象屬性。

如果使用此函數並將其放在控制器的作用域內，則可以使用字段的名稱和item對象來調用它：

<td ng-repeat="column in columns">{{ getDescendantProp(item, column.field) }}</td>

這是一個可行的想法示例： http : //plnkr.co/edit/34fKDKReu24381Ox8kdK?p=preview