AngularJS ng-bind-template 指令详解


Posted in Javascript onJuly 30, 2016

AngularJS ng-bind-template 指令

AngularJS 实例

<p> 元素上绑定两个表达式:

<!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>

<div ng-app="myApp" ng-bind-template="{{firstName}} {{lastName}}" ng-controller="myCtrl">

</div>

<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
 $scope.firstName = "John";
 $scope.lastName = "Doe";
});
</script>

</body>
</html>

运行结果:

         John Doe

定义和用法

ng-bind-template 指令用于告诉 AngularJS 将给定表达式的值替换 HTML 元素的内容。

当你想在 HTML 元素上绑定多个表达式时可以使用 ng-bind-template 指令。

语法

<element ng-bind-template="expression"></element>

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

参数值

描述
expression 一个或多个要执行的表达式,每个使用 {{  }} 包含。

以上就是对 AngularJS ng-bind-template 指令知识介绍,有需要的朋友看下。

Javascript 相关文章推荐
javascript 3d 逐侦产品展示(核心精简)
Mar 26 Javascript
javascript动态修改Li节点值的方法
Jan 20 Javascript
jquery代码实现简单的随机图片瀑布流效果
Apr 20 Javascript
JavaScript包装对象使用详解
Jul 09 Javascript
jquery常用函数与方法汇总
Sep 01 Javascript
10分钟掌握XML、JSON及其解析
Dec 06 Javascript
巧用Vue.js+Vuex制作专门收藏微信公众号的app
Nov 03 Javascript
在Vue组件上动态添加和删除属性方法
Feb 23 Javascript
详解Angular中实现自定义组件的双向绑定的两种方法
Nov 23 Javascript
前端Vue项目详解--初始化及导航栏
Jun 24 Javascript
在vue中使用Base64转码的案例
Aug 07 Javascript
详解JavaScript的计时器和按钮效果设置
Feb 18 Javascript
AngularJS ng-bind-html 指令详解及实例代码
Jul 30 #Javascript
AngularJS ng-bind 指令简单实现
Jul 30 #Javascript
AngularJS ng-app 指令实例详解
Jul 30 #Javascript
如何检测JavaScript的各种类型
Jul 30 #Javascript
详解js中的apply与call的用法
Jul 30 #Javascript
javascript回到顶部特效
Jul 30 #Javascript
javascript鼠标滑过显示二级菜单特效
Nov 18 #Javascript
You might like
《星际争霸重制版》兵种对比图鉴
2020/03/02 星际争霸
PHP5中虚函数的实现方法分享
2011/04/20 PHP
关于IIS php调用com组件的权限问题
2012/01/11 PHP
PHP的构造方法,析构方法和this关键字详细介绍
2013/10/22 PHP
PHP预定义变量9大超全局数组用法详解
2016/04/23 PHP
浅谈PHP的$_SERVER[SERVER_NAME]
2017/02/04 PHP
dropdownlist之间的互相联动实现(显示与隐藏)
2009/11/24 Javascript
javascript跟随滚动效果插件代码(javascript Follow Plugin)
2013/08/03 Javascript
jquery制作select列表双向选择示例代码
2014/09/02 Javascript
深入理解Angularjs向指令传递数据双向绑定机制
2016/12/31 Javascript
解决IOS端微信H5页面软键盘弹起后页面下方留白的问题
2019/06/05 Javascript
解决vue项目F5刷新mounted里的函数不执行问题
2019/11/05 Javascript
python解析模块(ConfigParser)使用方法
2013/12/10 Python
Python实现SSH远程登陆,并执行命令的方法(分享)
2017/05/08 Python
Python字符串、整数、和浮点型数相互转换实例
2018/08/04 Python
PyQt5图形界面播放音乐的实例
2019/06/17 Python
Python机器学习算法库scikit-learn学习之决策树实现方法详解
2019/07/04 Python
python实现KNN分类算法
2019/10/16 Python
如何使用selenium和requests组合实现登录页面
2020/02/03 Python
如何在python开发工具PyCharm中搭建QtPy环境(教程详解)
2020/02/04 Python
使用python批量转换文件编码为UTF-8的实现
2020/04/03 Python
Pycharm2020.1安装无法启动问题即设置中文插件的方法
2020/08/07 Python
python实现银行账户系统
2021/02/22 Python
浅谈HTML5新增和废弃的标签
2019/04/28 HTML / CSS
德国领先的大尺码和超大尺码男装在线零售商:Bigtex
2019/06/22 全球购物
WatchShop法国:英国排名第一的独立手表零售商
2020/02/17 全球购物
JSP和EJB可以共享HttpSession么?EJB里面可以改变session里面的内容
2013/06/05 面试题
Python使用openpyxl复制整张sheet
2021/03/24 Python
项目建议书怎么写
2014/05/15 职场文书
会计学毕业生求职信
2014/06/25 职场文书
2014年国庆节演讲稿
2014/09/19 职场文书
2014年班级工作总结范文
2014/12/23 职场文书
Python利用zhdate模块实现农历日期处理
2022/03/31 Python
Python万能模板案例之matplotlib绘制甘特图
2022/04/13 Python
MYSQL事务的隔离级别与MVCC
2022/05/25 MySQL
解决Git推送错误non-fast-forward的方法
2022/06/25 Servers