How to Use AngularJS Table data binding in

Total Post:341

 4278  View(s)
Rate this:
I want to use  AngularJS Table databinding in
  1. Post:282

    Re: How to Use AngularJS Table databinging in

    Table data is normally repeatable by nature. ng-repeat directive can be used to draw table easily

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AngularJs.aspx.cs" Inherits="Forumasp.AngularJs" %>

    <!DOCTYPE html>

    <html xmlns="">
    <head runat="server">
            <script src="Scripts/jquery-2.1.4.js"></script>
        <script src="Scripts/angular.min.js"></script>
       table, th , td {
          border: 1px solid grey;
          border-collapse: collapse;
          padding: 5px;
       table tr:nth-child(odd) {
          background-color: #f2f2f2;

       table tr:nth-child(even) {
          background-color: #ffffff;
       <div ng-app = "mainApp" ng-controller = "studentController">
             <table border = "0">
                            <th>Subject Name</th>
                         <tr ng-repeat = "subject in student.subjects">
                            <td>{{ }}</td>
                            <td>{{ subject.marks }}</td>
              var mainApp = angular.module("mainApp", []);
              mainApp.controller('studentController', function ($scope) {
                  $scope.student = {                
                      subjects: [
                         { name: 'Physics', marks: 70 },
                         { name: 'Chemistry', marks: 80 },
                         { name: 'Math', marks: 65 },
                         { name: 'English', marks: 75 },
                         { name: 'Hindi', marks: 67 }

      Modified On Apr-10-2018 06:38:11 AM


Please check, If you want to make this post sponsored

You are not a Sponsored Member. Click Here to Subscribe the Membership.