AngularJS - Tables

Table data is generally repeatable. The ng-repeat directive can be used to draw table easily. The following example shows the use of ng-repeat directive to draw a table −

   

      
Name
      
Marks
   
   
   

      
{{ subject.name }}
      
{{ subject.marks }}
   

Table can be styled using CSS Styling.

Example

The following example shows the use of all the above-mentioned directives.

testAngularJS.htm

   
      
      
      
      
   
   
   
      
AngularJS Sample Application
      

         
         

            

               
Enter first name:
               

            
            

               
Enter last name: 
               

                  
               
            
            

               
Name: 
               
{{student.fullName()}}
            
            

               
Subject:
               
               

                  .
                        

                     

                        
Name
Marks
                     
                     

                        
{{ subject.name }}
                        
{{ subject.marks }}
                     
                  
               
            
         
      
      
      
      
   

Output

Open the file testAngularJS.htm in a web browser and see the result.