Trying to bind json object to the html elements in a webpage. Json returned
objects have inner objects as well which is sometimes null as well. If
crtain property is null then i still need to show div but with some hard
coded values which i am trying to do with ng-if. But it does'nt work for me
whereever i use ng-if these are binding from the returned inner
employeeList object. Please suggest if two ng-repeats will be used here and
ng-if is applicable here??
Expected behavior
The expected result should be to show all the html elements if certain
property is absent from the inner object then the else condition should be
visible. (else condition here means ng-if where condition is (!=)).
HTML Code
<div class="container" ng-controller="profileController"
ng-init="loadProfilesData()">
<div ng-repeat="p in profileData">
<div>{{p.company}}</div>
<div>{{p.department}}</div>
<div ng-repeat="emp in p"></div>
<div ng-if="emp.Tag== 'Devo100'" gauge-chart
class="gauge" id="Devo100-{{p.Id}}" value=p.Value*100></div>
<div ng-if="emp.Tag== 'Devo101'" gauge-chart
class="gauge" id="Devo101-{{p.Id}}" value=p.Value*100></div>
<span ng-if="emp.Tag== 'Devo102'">
{{ p.Value | date: "hh:mm:ss" }}
</span>
</div>
</div>
</div>
JSON
profileData: [
{
ID: "1",
employeeList:
[{"Value":0.003,"Stat":{"parameter":0,"Name":"test0","Tag":"Devo100"}},
{"Value":0.004,"Stat":{"parameter":0,"Name":"test1","Tag":"Devo101"}},
{"Value":0.005,"Stat":{"parameter":0,"Name":"test2","Tag":"Devo102"}}],
comapny: "MSDFT",
department: "Sales"
},
{
ID: "2",
employeeList: null,
comapny: "MSDFT",
department: "HR"
},
{
ID: "3",
employeeList:
[{"Value":0.003,"Stat":{"parameter":0,"Name":"test0","Tag":"Devo100"}},
{"Value":0.004,"Stat":{"parameter":0,"Name":"test1","Tag":"Devo101"}}],
comapny: "MSDFT",
department: "Development"
},
{
ID: "4",
employeeList:
[{"Value":0.1,"Stat":{"parameter":0,"Name":"test2","Tag":"Devo102"}},
{"Value":0.25,"Stat":{"parameter":0,"Name":"test1","Tag":"Devo101"}}],
comapny: "MSDFT",
department: "Finance"
},
{
ID: "5",
employeeList:
[{"Value":0.233,"Stat":{"parameter":0,"Name":"test0","Tag":"Devo100"}}],
comapny: "MSDFT",
department: "Accounts"
}
]
When i am doing above it's not working properly sometimes it create 3 divs
sometimes 1 and so on
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
