[AngularJS] ngRepeat for master-details data

 AngularJS    ngRepeat  

▌Introduction

---

We have a master-details data, and we would like to display all the information in a HTML table. For example, a sales order contains several books within it. In this case, the sales order is the Master, and books are the Details.

(JSON for reference)

{'Id':'00001','Date':'2016/08/15','Customer':'JB','Books':[{'Id':'A123','Title':'BOOK1'},{'Id':'B022','Title':'BOOK2'}]}

In the following two demos, I will show how to use ngIf, ngRepeat, ng-repeat-start/end to format the master-details data on a HTML table.

▌Environment

---

l   AngularJS 1.5.5

▌Demo

---

▋Demo 1

#ngRepeat  #ng-repeat-start  #ng-repeat-end

▋Demo 2

#ngRepeat  #ngIf  #ngShow  #ngHide

 

▌Reference

---

l   if else statement in AngularJS templates

l   AngularJS Multiple ng-repeats on single row of table