Tạo bảng trong AngularJS | 26 bài hướng dẫn AngularJs miễn phí PDF

http://vietjack.com/angularjs/index.jsp Copyright © vietjack.com AngularJS - Bảng Dữ liệu bảng thường lặp lại theo thứ tự tự nhiên Ng-repeat directive sử dụng để vẽ bảng cách dễ dàng Dưới ví dụ cách sử dụng ng-repeat để tạo bảng Name Marks {{ subject.name }} {{ subject.marks }} Bảng sử dụng với CSS style 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; } Ví dụ Dưới ví dụ cụ thể cho directive giới thiệu bên http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com/angularjs/index.jsp Copyright © vietjack.com testAngularJS.jsp Angular JS Table 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; } AngularJS Sample Application Enter first name: Enter last name: Name: {{student.fullName()}} Subject: Name Marks http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com/angularjs/index.jsp Copyright © vietjack.com {{ subject.name }} {{ subject.marks }} var mainApp = angular.module("mainApp", []); mainApp.controller('studentController', function($scope) { $scope.student = { firstName: "Mahesh", lastName: "Parashar", fees:500, subjects:[ {name:'Physics',marks:70}, {name:'Chemistry',marks:80}, {name:'Math',marks:65}, {name:'English',marks:75}, {name:'Hindi',marks:67} ], fullName: function() { var studentObject; studentObject = $scope.student; return studentObject.firstName + " " + studentObject.lastName; } }; }); http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com/angularjs/index.jsp Copyright © vietjack.com Kết Mở trang textAngularJS.jsp trình duyệt web Và xem kết bên http://vietjack.com/ Trang chia sẻ học online miễn phí Page ... online miễn phí Page http://vietjack.com /angularjs/ index.jsp Copyright © vietjack.com Kết Mở trang textAngularJS.jsp trình duyệt web Và xem kết bên http://vietjack.com/ Trang chia sẻ học online miễn. .. ng-repeat="subject in student.subjects"> http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com /angularjs/ index.jsp Copyright © vietjack.com {{ subject.name }} {{...http://vietjack.com /angularjs/ index.jsp Copyright © vietjack.com testAngularJS.jsp Angular JS Table