编程 Javascript

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 指令。

语法

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

参数值

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

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

AngularJS ng-bind-template 指令详解

- Author -

lqh

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

使用js实现关闭js弹出层的窗口

Feb 10 Javascript

js脚本获取webform服务器控件的方法

May 16 Javascript

JavaScript作用域链示例分享

May 27 Javascript

node.js中的fs.truncate方法使用说明

Dec 15 Javascript

js实现跨域的多种方法

Dec 25 Javascript

Bootstrap基本插件学习笔记之按钮(21)

Dec 08 Javascript

Bootstrap popover用法详解

Dec 22 Javascript

用原生JS实现简单的多选框功能

Jun 12 Javascript

JS跳转手机站url的若干注意事项

Oct 18 Javascript

vuex actions传递多参数的处理方法

Sep 18 Javascript

微信小程序换肤功能实现代码(思路详解)

Aug 25 Javascript

vue 使用微信jssdk,调用微信相册上传图片功能

Nov 13 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