現在、私はangularJSのforEachメソッドを使用して2つのオブジェクトをマップし、アコーディオンで表示しようとしています。私は実際に私が望む結果を得ているわけではありません...それは本当にフィルタリングしていないか、htmlで必要な正しいデータを吐き出していません。ここforEachをangularJSのアコーディオンにマップする方法
私はこれまで...
HTML持っているものです:私はちょうどよ
$scope.otherFees = [{'name': 1, 'text': 'ok', 'amount': 2}, {'name': 2, 'text': 'hello', 'amount': 3}, {'name': 3, 'text': 'cool', 'amount': 3}]
$scope.fees = [
{
'headingName': 'firstHeader',
'feeBag': [
{'name': 1}
]
},
{
'headingName': 'secondHeader',
'feeBag': [
{'name': 2}
]
},
{
'headingName': 'thirdHeader',
'feeBag': [
{'name': 3}
]
}
]
:
<accordion ng-repeat="fee in fees">
<accordion-group ng-if="fee.feeBag.length">
<accordion-heading>
{{fee.headingName}}
</accordion-heading>
<div class="feecode-height" ng-repeat="feeParameter in fee.feeBag">
<div class="row">
<div class="col-xs-1">{{feeParameter.name}}</div>
<div class="col-xs-4">{{feeParameter.text}}</div>
<div class="col-xs-2" >{{feeParameter.amount}}</div>
</div>
</div>
</accordion-group>
</accordion>
はコントローラー:
angular.forEach($scope.fees, function(value, key) {
angular.forEach(value.feeBag, function(value2, key2) {
if (value.feeBag[key2].name === $scope.otherFees.name) {
value.feeBag[key2].text = $scope.otherFees.text;
value.feeBag[key2].amount = $scope.otherFees.amount;
return value.feeBag[key2];
} else {
// remove the ones that dont belong
// value.feeBag.splice(key, 1);
}
});
});
JSON値を私が行くべき場所にこだわった次に....名前を見出して値をグループ化し、個々のセットを行に表示させるように設定したようです。
すべての助けに感謝:D
'ng-if =" fee.feeBag.length "を' ng-if = "fee.feeBag.length> 0" 'に変更してみてください。 – Yatin
ヘッダーはうまくいきます。 – jeremy
ブートストラップアコーディオンなどを使用しようとしていますか?ブートストラップのものはパネルクラスのdivタグを使用してアコーディオンに変換されます。 – Yatin