AngularJS基础 ng-include 指令简单示例


Posted in Javascript onAugust 01, 2016

AngularJS ng-include 指令

AngularJS 实例

包含 HTML 文件:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="">

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

</body>
</html>

运行结果:

myFile.htm 文件标题

这个文本来自被包含的文件 myFile.htm!

定义和用法

ng-include 指令用于包含外部的 HTML 文件。

包含的内容将作为指定元素的子节点。

ng-include 属性的值可以是一个表达式,返回一个文件名。

默认情况下,包含的文件需要包含在同一个域名下。

语法

<element ng-include="filename" onload="expression" autoscroll="expression" ></element>

ng-include 指令作为元素使用:

<ng-include src="filename" onload="expression" autoscroll="expression" ></ng-include>

所有的 HTML 元素都支持该指令。

参数值

描述
filename 文件名,可以使用表达式来返回文件名。
onload 可选, 文件载入后执行的表达式。
autoscroll 可选,包含的部分是否在指定视图上可滚动。

以上就是对AngularJS ng-include指令的知识整理,后续继续补充。

Javascript 相关文章推荐
修改jquery里的dialog对话框插件为框架页(iframe) 的方法
Sep 14 Javascript
JS控制图片翻转示例代码(兼容firefox,ie,chrome)
Dec 19 Javascript
利用原生JavaScript获取元素样式只是获取而已
Oct 08 Javascript
详解JavaScript中localStorage使用要点
Jan 13 Javascript
JavaScript提高性能知识点汇总
Jan 15 Javascript
Javascript的表单验证-提交表单
Mar 18 Javascript
AngularJS入门教程之AngularJS 模板
Aug 18 Javascript
AngularJS中isolate scope的用法分析
Nov 22 Javascript
node.js的事件机制
Feb 08 Javascript
简单实现js选项卡切换效果
Feb 09 Javascript
浅谈Vue3 Composition API如何替换Vue Mixins
Apr 29 Javascript
js实现纯前端压缩图片
Nov 16 Javascript
jQuery实现的表头固定效果实例【附完整demo源码下载】
Aug 01 #Javascript
AngularJS基础 ng-if 指令用法
Aug 01 #Javascript
AngularJS控制器之间的数据共享及通信详解
Aug 01 #Javascript
BootstrapTable+KnockoutJS自定义T4模板快速生成增删改查页面
Aug 01 #Javascript
AngularJS基础 ng-href 指令用法
Aug 01 #Javascript
jQuery实现点击行选中或取消CheckBox的方法
Aug 01 #Javascript
AngularJS基础 ng-hide 指令用法及示例代码
Aug 01 #Javascript
You might like
PHP与SQL注入攻击[一]
2007/04/17 PHP
php mysql索引问题
2008/06/07 PHP
php可应用于面包屑导航的递归寻找家谱树实现方法
2015/02/02 PHP
PHP命名空间namespace及use的简单用法分析
2018/08/03 PHP
25个非常棒的jQuery滑块插件和教程小结
2011/09/02 Javascript
关于scrollLeft,scrollTop的浏览器兼容性测试
2013/03/19 Javascript
JS+CSS实现一个气泡提示框
2013/08/18 Javascript
javascript中对Attr(dom中属性)的操作示例讲解
2013/12/02 Javascript
JavaScript模块随意拖动示例代码
2014/05/27 Javascript
js实现的四级左侧网站分类菜单实例
2015/05/06 Javascript
jQuery.deferred对象使用详解
2016/03/18 Javascript
如何高效率去掉js数组中的重复项
2016/04/12 Javascript
JavaScript中split与join函数的进阶使用技巧
2016/05/03 Javascript
好好了解一下Cookie(强烈推荐)
2016/06/14 Javascript
JS匿名函数类生成方式实例分析
2016/11/26 Javascript
Vuex的初探与实战小结
2018/11/26 Javascript
浅谈ECMAScript 中的Array类型
2019/06/10 Javascript
Vue 中 a标签上href无法跳转的解决方式
2019/11/12 Javascript
Python内置函数OCT详解
2016/11/09 Python
Python断言assert的用法代码解析
2018/02/03 Python
解决安装tensorflow遇到无法卸载numpy 1.8.0rc1的问题
2018/06/13 Python
python 自动重连wifi windows的方法
2018/12/18 Python
Python面向对象程序设计示例小结
2019/01/30 Python
python图形工具turtle绘制国际象棋棋盘
2019/05/23 Python
Python中的支持向量机SVM的使用(附实例代码)
2019/06/26 Python
Python使用tkinter模块实现推箱子游戏
2019/10/08 Python
使用Python函数进行模块化的实现
2019/11/15 Python
Python return语句如何实现结果返回调用
2020/10/15 Python
pycharm Tab键设置成4个空格的操作
2021/02/26 Python
纯css3实现的竖形无限级导航
2014/12/10 HTML / CSS
国际书籍零售商:Wordery
2017/11/01 全球购物
销售高级职员求职信
2013/10/29 职场文书
地震慰问信
2015/02/14 职场文书
2015高考寄语集锦
2015/02/27 职场文书
歌咏比赛口号大全
2015/12/25 职场文书
vue中控制mock在开发环境使用,在生产环境禁用方式
2022/04/06 Vue.js