使用AngularJS来实现HTML页面嵌套的方法_AngularJS_动视

使用AngularJS来实现HTML页面嵌套的方法_AngularJS

2020-11-27 21:39:33 责编:小采

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

HTML不支持嵌入在HTML页面中的HTML页面。实现这一功能通过使用以下方式：

使用Ajax - 让一台服务器来调用获取相应的HTML页面，并将其设置在HTML控件的innerHTML。

使用服务器端包含 - JSP，PHP等Web端服务器技术可以在包括动态页面中的HTML页面。

使用AngularJS，我们可以用ng-include指令在一个HTML页面嵌入另一个HTML页面。

例子
tryAngularJS.html



Angular JS Includes



AngularJS Sample Application





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;
 }
 };
}

main.html

subjects.html

输出

要运行这个例子，需要部署textAngularJS.html，main.html和subjects.html 到一个网络服务器。使用服务器URL在Web浏览器中打开textAngularJS.html。看到结果。

下载本文

显示全文

全部频道

AngularJS Sample Application