AngularJS基础知识笔记之表格_AngularJS

来源：动视网责编：小采时间：2020-11-27 21:38:13

AngularJS基础知识笔记之表格_AngularJS

AngularJS基础知识笔记之表格_AngularJS:表格数据本质上通常是重复的。ng-repeat指令，可以用来方便地绘制表格。下面的示例说明使用ng-repeat指令来绘制表格。 Name Marks {{ subject.name }} {{ subject.marks }} 表格可以使用CSS样式设置样式，如下： table, th

推荐度：

点击下载本文 文档为doc格式

导读AngularJS基础知识笔记之表格_AngularJS:表格数据本质上通常是重复的。ng-repeat指令，可以用来方便地绘制表格。下面的示例说明使用ng-repeat指令来绘制表格。 Name Marks {{ subject.name }} {{ subject.marks }} 表格可以使用CSS样式设置样式，如下： table, th

表格数据本质上通常是重复的。ng-repeat指令，可以用来方便地绘制表格。下面的示例说明使用ng-repeat指令来绘制表格。


 
 Name
 Marks
 
 
 {{ subject.name }}
 {{ subject.marks }}

Name	Marks
{{ subject.name }}	{{ subject.marks }}

表格可以使用CSS样式设置样式，如下：

例子
下面的例子将展示上述所有指令。

testAngularJS.html



Angular JS Table



AngularJS Sample Application


Enter first name: 
Enter last name: 
Name: {{student.fullName()}}
Subject: 

 
 Name
 Marks
 
 
 {{ subject.name }}
 {{ subject.marks }}
 





function studentController($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;
 }
 };
}

以上所述就是本文的全部内容了，希望大家能够喜欢。

AngularJS基础知识笔记之表格_AngularJS

推荐度：

点击下载本文 文档为doc格式

标签：表格知识 an

热门焦点

AngularJS基础知识笔记之表格_AngularJS

AngularJS基础知识笔记之表格_AngularJS

AngularJS Sample Application

AngularJS基础知识笔记之表格_AngularJS

最新推荐

猜你喜欢

热门推荐