web-dev-qa-db-ja.com

AngularJS:JSONオブジェクトのキーを取得する方法

これがAngularJSと何か関係があるのか​​、JSON関連だけなのかはわかりません。

とにかく、次のJSONがあるとしましょう。

$scope.dataSets = {
    "names": ["Horace", "Slughorn", "Severus", "Snape"],
    "genders": ["Male", "Female"]
}

今、私はng-repeatディレクティブを使用して上記を次のように出力しています:

<div ng-repeat="data in dataSets>
    //Continue readig to know what I am expcting here
</div>

<div></div>タグ内で期待するのは、「名前」と「性別」を印刷することです。つまり、JSONのキーを出力したいのです。キーが何であるかもしれないので、私はキーが何であるか分かりません。これどうやってするの?

48
callmekatootie

ドキュメントが述べているように:

(key、value)in expression –ここで、keyとvalueはユーザー定義の識別子であり、expressionは列挙するコレクションを提供するスコープ式です。

<div ng-repeat="(key, data) in dataSets">
  {{key}}
</div>
97
Stewie

JsonAngularJs内のコントローラー内からキーと値のペアにアクセスするため。

for(var keyName in $scope.dataSets){        
     var key=keyName ;
     var value= $scope.dataSets[keyName ];

  alert(key)
  alert(JSON.stringify(value));

}
9

dataSetsがオブジェクトではなく配列である場合、最初に配列項目、次にキーまたは値をng-repeatする必要があります。

<div ng-repeat="item in dataSets">
   <div ng-repeat="(key, value) in item">
   {{key}}
   {{value}}
   </div>
</div>

ちょうど2セントです。

3
edgarpetrauskas

DataSetsのすべてのdataSetについて、キーを印刷してから、個々のアイテムを繰り返し処理します。

<div ng-repeat="(key, dataSet) in dataSets">
   <div>{{key}}</div>
   <div ng-repeat="value in dataSet">   
        {{value}}
   </div>
</div>

{{dataset}}も一度に表示できます。配列は値のコンマ区切りリストとして表示されます。

1
Jose Ramon Polo