angularjs字符串插值($interpolate)
<!DOCTYPE html>
<html lang="zh-CN" ng-app="app">
<head>
<meta charset="utf-8">
<title>字符串插值</title>
<link rel="stylesheet" href="../bootstrap.min.js">
</head>
<body ng-controller="myController">
To: <input type="text" ng-model="to" placeholder="输入联系人">
<br>
email:
<br>
<textarea ng-model="emailBody"></textarea>
<br>
<!-- 第二个例子这里需要修改为 ‘_ _’这个符号 -->
预览: <pre>_previewText_</pre>
<script src="../angular.min.js"></script>
<script>
// 字符串插值 这里演示将$interpolate封装为services的用法
// angular.module('app', [])
// .controller('myController', function($scope, $interpolate) { // 直接使用$interpolate的演示
// $scope.$watch('emailBody', function(body) {
// console.log(body)
// if(body) {
// var template = $interpolate(body);
// $scope.previewText = template({ to: $scope.to });
// }
// })
// }) // 修改标识表达式的符号{{ }}为_ _ , 查看这个例子 需要将html中的{{ }} 改为_ _
angular.module('app', [])
.config(['$interpolateProvider',
function($interpolateProvider) {
$interpolateProvider.startSymbol('_');
$interpolateProvider.endSymbol('_');
}
])
.factory('EmailParser', ['$interpolate',
function($interpolate) { // 也可以将 $interpolate 封装成为一个services
return {
parse: function(text, contact) {
var template = $interpolate(text);
return template(contact);
}
}
}
])
.controller('myController', ['$scope', 'EmailParser',
function($scope, EmailParser) {
$scope.$watch('emailBody', function(body) {
if(body) {
$scope.previewText = EmailParser.parse(body, {
to: $scope.to
})
}
})
}
])
</script>
</body>
</html>
angularjs字符串插值($interpolate)的更多相关文章
- AngularJS 字符串
AngularJS字符串就像是JavaScript字符串 <!DOCTYPE html><html><head><meta http-equiv=" ...
- Swift字符串插值
字符串插值是一种全新的构建字符串的方式,可以在其中包含常量.变量.字面量和表达式.您插入的字符串字面量的每一项都被包裹在以反斜线为前缀的圆括号中: let multiplier = let messa ...
- Scala字符串插值
Scala提供了三种字符串插值方式:s,f和raw.1. s字符串插值器简单的说就是解析字符串变量. val name = "Tom" println(s"His nam ...
- [转] Scala 2.10.0 新特性之字符串插值
[From] https://unmi.cc/scala-2-10-0-feature-string-interpolation/ Scala 2.10.0 新特性之字符串插值 2013-01-20 ...
- CoffeeScript里的字符串插值
拼接字符串是我们常干的事情.与其用很多的 "" + "",不如用一下字符串插值,可读性好些. 方法是在字符串中加入#{ 变量.表达式.函数等} getOther ...
- React技巧之字符串插值
原文链接:https://bobbyhadz.com/blog/react-string-interpolation 作者:Borislav Hadzhiev 正文从这开始~ 总览 在React中,使 ...
- AngularJS 简介、指令、表达式
AngularJS 是一个 JavaScript 框架.它可通过 <script> 标签添加到 HTML 页面. AngularJS 通过指令扩展了 HTML,且通过表达式绑定数据到 HT ...
- AngularJS安装配置与基础概要整理(上)
以前整理的,可供参考. 安装: 1.首先要安装node.js和它的npm包管理系统.(nodejs相关待整理) 2.安装grunt .grunt是一个基于任务的Javascript工程命令行构建工具. ...
- AngularJS快速入门指南03:表达式
AngularJS通过表达式将数据绑定到HTML. AngularJS表达式 AngularJS表达式写在双大括号中:{{ 表达式语句 }}. AngularJS表达式绑定数据到HTML的方式与ng- ...
随机推荐
- java学习笔记(3):java的工作原理及相关基础
一.运行机制 如上图所示,图中内容即为Java的运行机制: 1.我们一开始所编写的代码文件存储格式为(如text.java)文件,这就是源程序文件 2.在Java编辑器的作用下,也就是就行了编译,形成 ...
- uva 10609 - Fractal
题目大意:给出A,B两个点的坐标,以及T,每次找到A.B的四等分点C,D,然后以AB/2为边长,C,D为顶点,构建一个等边三角形,E为另外一个顶点,然后再对C,E:E,D做同样的操作,直到构建的等边三 ...
- keypress和keydown事件及keyCode和keyChar
二:keypress和keydown事件: 现只在IE10.chrome(版本 32.0.1700.107 m).firefox(25.0.1)中测试了. IE8 chrome firefox $ ...
- Apache之AllowOverride参数详解
通常利用Apache的rewrite模块对 URL 进行重写的时候, rewrite规则会写在 .htaccess 文件里.但要使 apache 能够正常的读取.htaccess 文件的内容,就必须对 ...
- em与px的区别 [ 转 ]
其实,还是不大理解,为什么1em=16px:而且,还一般要在body里面,就写清楚Fone-size=62.5%,然后再让1em=10px进行使用:那么,为什么不直接在当时定义em的时候,就直接让它等 ...
- MySQL 查询结果保存为CSV文件
MySQL支持将查询结果直接导出为文本格式,格式如下: into outfile '导出的目录和文件名' 指定导出的目录和文件名 fields terminated ...
- mark 的总结开发笔记-备
2.播放音乐:-(void) playMusic{@try{//取文件路径NSString *musicFilePath = [[NSBundle mainBundle] pathForResourc ...
- 记录终端输出的LOG到文件
先要说明为什么要记录终端会话,因为常会遇到这样的情况,终端是有缓存大小限制的,当在终端打印的消息超出缓存范围,它前面的打印消息就自动丢失了,这对于我们调试程序会造成障碍,所以有记录完整终端打印消息的必 ...
- eclipse,tomcat部署web项目,以及本地文件访问
1.直接把项目复制到Tomcat安装目录的webapps目录中,这是最简单的一种Tomcat项目部署的方法,也是初学者最常用的方法. 2.在tomcat安装目录中有一个conf文件夹,打开此文件夹,其 ...
- Web 前端利器Emmet 的HTML用法总结
在tutsplus那里看到一篇文章介绍Emmet 的用法,形象的gif图片一目了然,本来想翻译过来的(虽然翻译用法倒不是很难),但搜索发现已经有国人翻译过了,遂直接拿来转载在这里. Emmet 简介 ...