1.在HTML中包含HTML文件：在HTML中，目前还不支持包含HTML文件的功能；

2.服务端包含：大多数服务端脚本都支持文件功能(SSI)，使用SSI，你可以在HTML中包含HTML文件，并发送到客户端浏览器：

<?php require("navigation.php");?>

3.客户端包含HTML：

**通过javascript有很多种方式可以在HTML中包含HTML文件；

**通常我们使用http请求(AJAX)从服务端获取数据，返回的数据我们可以通过使用innerHTML写入到HTML元素中

<body ng-app="">

<div ng-include="  'runoob.htm' ">

</body>

4.包含AngularJS代码：ng-include指令除了可以包含HTML文件外，还可以包含AngularJS代码；

<div ng-app="myApp" ng-controller="siteCtrl">

　　<div ng-include=" 'sites.htm' "></div>

</div>

<script>

var app=angular.module('myApp',[]);

app.controller('sitesCtrl',function($scope,$http){

　　$http.get("sites.php").then(function(response){

　　　　$scope.names=response.data.records;

　　});

});

</script>

5.跨域包含：默认情况下，ng-include指令不允许包含其他域的文件；如果你需要访问其他域名的文件，需要设置域名访问白名单；

<body ng-app="myApp">

<div ng-include=" 'http://c.runoob.com/runoobtest/angular_include.php' "></div>

<script>

var app=angular.module('myApp',[]);

app.config(function($sceDelegateProvider){

　　$sceDelegateProvider.resourceUrlWhitelist([

　　　　'http://c.runoob.com/runoobtest/**'

　　]);

});

</script>

</body>

6.需要设置服务端允许跨域访问，设置：

<?php

header('Access-Control-Allow-Origin:*');         //允许所有域名访问

echo '<b style="color:red">我是跨域的内容</b>';

?>

AngularJS包含的更多相关文章

  1. 【18】AngularJS 包含

    AngularJS 包含 在 AngularJS 中,你可以在 HTML 中包含 HTML 文件. 在 HTML 中包含 HTML 文件 在 HTML 中,目前还不支持包含 HTML 文件的功能. 服 ...

  2. AngularJS 包含

    在 AngularJS 中,你可以在 HTML 中包含 HTML 文件. 在 HTML 中,目前还不支持包含 HTML 文件的功能. 大多服务端脚本都支持包含文件功能 (SSI: Server Sid ...

  3. AngularJS 包含HTML文件

    类似于python tornado的include方法,同样是可以在一个html文件中加载另外一个html文件,这样可以不用重复的写一些几乎不改变的代码. 首先创建两个文件,然后代码如下: <! ...

  4. AngularJS(13)-包含

    AngularJS 包含 使用 AngularJS, 你可以使用 ng-include 指令来包含 HTML 内容: 实例 <body> <div class="conta ...

  5. AngularJS：包含

    ylbtech-AngularJS:包含 1.返回顶部 1. AngularJS 包含 在 AngularJS 中,你可以在 HTML 中包含 HTML 文件. 在 HTML 中包含 HTML 文件 ...

  6. AngularJs之九（ending......)

    今天继续angularJs,但也是最后一篇关于它的了,基础部分差不多也就这些,后续有机会再写它的提升部分. 今天要写的也是一个基础的选择列表: 一:使用ng-options,数组进行循环. <d ...

  7. AngularJS Bootstrap

    AngularJS 的首选样式表是 Bootstrap. 可以在 AngularJS 应用中加入 Twitter Bootstrap,你可以在你的 <head>元素中添加如下代码: < ...

  8. Atitit Server Side Include  ssi服务端包含规范 csi  esi

    Atitit Server Side Include  ssi服务端包含规范 csi  esi 一.CSI (Client Side Includes)  1 1.1. 客户端包含1 1.2. Ang ...

  9. 3.1将AngularJS放入上下文

    本章,作者将AngularJS放在全球web app开发的上下文里,并为后面的章节设置功能.AngularJS的目标,是带来一款工具,它有服务端开发web client的能力,并易于开发,测试,富.复 ...

随机推荐

  1. Brackets前端开发IDE工具

    Brackets是一个开源的前端开发IDE工具,网页设计师和前端开发人员必备的前端开发IDE工具. 它能够使你在开发WEB网站实时预览你的网页,目前版本只适用于Chrome浏览器可以实时预览效果 支持 ...

  2. 关于背景图相对父容器垂直居中问题 —— vertical-align 和 line-height 之间的区别

       html css <div class="register-wrapper"> <div class="register"> &l ...

  3. <!DOCTYPE>标签的定义与用法

    <!DOCTYPE> 声明不是 HTML 标签:它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令. 在 HTML 4.01 中,<!DOCTYPE> 声明 ...

  4. Java Web学习笔记3

    今天做了一个实验:Servlet访问WEB-INF目录下的文件notice.html 最后始终不能出现预期的效果,我猜想可能是使用了Tomcat 8版本的原因吧,暂时放下,等以后知识丰富了,再来解决它 ...

  5. java8--类加载机制与反射(java疯狂讲义3复习笔记)

    本章重点介绍java.lang.reflect包下的接口和类 当程序使用某个类时,如果该类还没有被加载到内存中,那么系统会通过加载,连接,初始化三个步骤来对该类进行初始化. 类的加载时指将类的clas ...

  6. Angular-Chart.js 初接触;;;

    可以先看下下面的链接,了解下, 推荐链接 准备工作 JS文件{angular.js.Chart.js.angular-chart.js} 这3个文件我的获取难易程度:Chart.js > ang ...

  7. tyvj1008 传球游戏

    背景 NOIP2008复赛普及组第三题 描述 上体育课的时候,小蛮的老师经常带着同学们一起做游戏.这次,老师带着同学们一起做传球游戏. 游戏规则是这样的:n个同学站成一个圆圈,其中的一个同学手里拿着一 ...

  8. IBAction和IBOutlet

    - IBAction: - 本质就是void - 能让方法具备连线的功能- IBOutlet - 能让属性具备连线的功能

  9. jQuery入门（4）jQuery中的Ajax应用

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  10. Scrum Meeting ——总结

    冲刺总结 0*.燃尽图 迟来的燃尽图,别看它是最后一天掉了一堆,感觉很假,像是人为的把issues都关闭掉.其实不然,很多功能是大家平时做好,但是没整合在一起,所以没燃掉,在最后几天的整合中,通过测试 ...