Angular Nested ng repeat Example

Angular Nested ng repeat Example

Today, We want to share with you Angular Nested ng repeat Example.
In this post we will show you Angular Nested ng repeat Example, hear for Angular Nested ng repeat Example we will give you demo and example for implement.
In this post, we will learn about Angular Nested ng repeat Example with an example.

I clarified the syntax of aliasing inside of the angulars simple ng-repeat directives.

The ng-repeat for angularjs directive instantiates basic a template one type once per item from a all collection like as an array, or list etc

When angularjs goes simple through the browserside-HTML code and html elements, it will first find the angularjs simple directives in the same page and then it’s parse the HTML tag page accordingly.

READ :  Multiple Skype Accounts - Windows desktop Run Two Skype

Simple Example of Nested ng-repeat

<div ng-repeat="post in myData">
   <div ng-repeat="day in post.days">
      {{day.dow}} - {{day.templateDay}}
      <b>Jobs:</b><br/> 
       <ul>
         <li ng-repeat="job in day.jobs"> 
           {{job.name}} 
         </li>
       </ul>
   </div>
</div>

Quick Tip:

//simple contoller code

$scope.headers = ['menu1','menu2', 'menu3'];

$scope.data = [
    {
        'menu1': 'data1-1',
        'menu2': 'data1-2',
        'menu3': 'data1-3'
    },
    {
        'menu1': 'data2-1',
        'menu2': 'data2-2',
        'menu3': 'data2-3'
    }
    //some code...
]

<table>
    <thead>
        <tr>
            <th ng-repeat="field in headers">{{header}}</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="row in data">
            <td ng-repeat="field in headers">{{ row[field] }}</td>
        </tr>
</table>

Here Is Working Example :

View Demo

Add a Comment

Your email address will not be published. Required fields are marked *