This question already has an answer here:
- inline conditionals in angular.js 7 answers
I am using Angularjs and I am populating data from json file. I am using ng-repeat to display data. There is a Categories, subcategories and Products. Some Categories had subcategories some categories had some products. I am trying to write condition like if categories had subcategories display subcategories and if has product then display products.
[{
"category":"Cables",
"subCategories":[
{
"subCategory":"Sub Category 1"
},
{
"subCategory":"Sub Category 2"
}
]
},
{
"category":"Wallplates & Boxes",
"subCategories":[
{
"subCategory":"Sub Category 6"
},
{
"subCategory":"Sub Category 7"
}
]
},
{
"category":"Media Distribution",
"products":[
{
"proTitle":"Product 1"
},
{
"proTitle":"Product 2"
}
]
}]
The controller is below.
var app = angular.module('analytics', []);
app.controller ('categoryCtrl', function ($scope, $http){
$http.get('json/category_data_new.json').success(function(data) {
$scope.chartValues = data;
});
});
I am using below code to display Categories and under subcategories
<ul class="nav">
<li ng-repeat="chartValue in chartValues">
<span ng-click="loadRecord(chartValue, $index)">
{{chartValue.category}}
</span>
<ul ng-show="chartValue.subCatList">
<li ng-repeat="item in chartValues[$index].subCategories">
<span ng-click="loadSubRecord(item, $index)">
{{item.subCategory}}
</span>
</li>
</ul>
</li>
</ul>
if any one have any idea how do this? please suggest.