Angular4中常用管道

原文链接:http://blog.csdn.net/haijing1995/article/details/71404350

-----------------------------------------------------

Angular4中常用管道

通常我们需要使用管道实现对数据的格式化,Angular4中的管道和之前有了一些变化,下面说一些常用的管道。

一、大小写转换管道

uppercase将字符串转换为大写 
lowercase将字符串转换为小写

<p>将字符串转换为大写{{str | uppercase}}</p>
  • 1
  • 1
str:string = 'hello'
  • 1
  • 1

页面上会显示 
将字符串转换为大写HELLO

二、日期管道

date。日期管道符可以接受参数,用来规定输出日期的格式。

<p>现在的时间是{{today | date:'yyyy-MM-dd HH:mm:ss'}}</p>
  • 1
  • 1
today:Date = new Date();
  • 1
  • 1

页面上会显示现在的时间是2017年05月08日10时57分53秒

三、小数管道

number管道用来将数字处理为我们需要的小数格式 
接收的参数格式为{最少整数位数}.{最少小数位数}-{最多小数位数} 
其中最少整数位数默认为1 
最少小数位数默认为0 
最多小数位数默认为3 
当小数位数少于规定的{最少小数位数}时,会自动补0 
当小数位数多于规定的{最多小数位数}时,会四舍五入

<p>圆周率是{{pi | number:'2.2-4'}}</p>
  • 1
  • 1
pi:number = 3.14159;
  • 1
  • 1

页面上会显示 
圆周率是03.1416

四、货币管道

currency管道用来将数字转换为货币格式

<p>{{a | currency:'USD':false}}</p>
<p>{{b | currency:'USD':true:'4.2-2'}}</p>
  • 1
  • 2
  • 1
  • 2
a:number = 8.2515
b:number = 156.548
  • 1
  • 2
  • 1
  • 2

页面上将显示 
USD8.25 
0156.55USDUnitedStatesdollarfalse符,当为true时,则显示$符。后面的规定小数位数的参数和上面介绍的一样。


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/538496.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

mysql死锁无法查询_MySQL死锁导致无法查询

客服反馈后台无法查询&#xff0c;原因大概知道&#xff0c;是因为MySQL的事务产生了死锁&#xff0c;以往都不知道是哪个事务锁住了&#xff0c;只能很粗暴地重启MySQL最近查找到一个方法&#xff0c;不用重启MySQL&#xff0c;记录如下登录到MySQL&#xff0c;来看下有哪些My…

彩铅练习,花船

图片发自简书App图片发自简书App

python 百度ocr识别_Python使用百度Ocr识别文字保存CSV

1.准备&#xff1a;1)Python开发环境, 笔者用的是3.7; 工具用的是Pycharm2)百度云后台创建文字识别的应用, 获取AppID, API key, Secret Key百度云后台创建文字识别的应用3) 百度模块pip install baidu-aip安装百度模块4) 要保存成csv需要用到pandas模块pip Install pandas安装…

chrome解决跨域(CORS)问题---chrome插件

1、chrome浏览器 chrome中跨域问题&#xff0c;可以安装插件解决&#xff0c; 插件地址 https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi 地址需要翻墙 翻墙hosts&#xff1a;https://laod.cn/hosts/2017-google-host…

我的女朋友漏电了–论C++中的失败(failure),缺陷(bug)和异常(exception)

先做个广告置入&#xff0c;如果喜欢这篇文章&#xff0c;你可以到 zhaoyan.website/blog 去查看于此类似的C/C文章。 我承认有点标题党了&#xff0c;不过这真的是一篇写软件的文章&#xff0c;所以如果你已经抽出了一张面巾纸&#xff0c;那么趁早再把它完美的放回去。这篇软…

SQLplus 和mysql区别_mysql和oracle的区别有哪些

MySQL和Oracle都是流行的关系数据库管理系统(RDBMS)&#xff0c;在世界各地广泛使用&#xff1b;大多数数据库以类似的方式工作&#xff0c;但MySQL和Oracle的这里和那里总是存在一些差异的。本篇文章就给大家比较Oracle和MySQL&#xff0c;介绍Oracle和MySQL之间的区别&#x…

127.0.0.1与localhost的区别

2019独角兽企业重金招聘Python工程师标准>>> 区别1&#xff1a; localhost也叫local &#xff0c;正确的解释是:本地服务器 127.0.0.1在windows等系统的正确解释是:本机地址(本机服务器) 他们的解析通过本机的host文件&#xff0c;windows自动将localhost解析为127.…

一个项目经理的贪嗔痴

我有时候在想&#xff0c;自己到底是一个什么角色&#xff1f;产品经理&#xff1f;还是一个项目经理&#xff1f;或者只是一个技术经理。 身边一些朋友说&#xff0c;自己想转行做一个产品经理&#xff0c;做一个伟大的产品。我奉劝他们说还是省省吧&#xff0c;在这样一个二三…

mysql 索引_MySQL之索引

索引查找算法BTREEBTREE查找算法演变B-TREE &#xff1a;普通 BTREE&#xff0c;平衡多路查找树(B-Tree)BTREE &#xff1a;叶子节点双向指针BTREE(B*TREE)&#xff1a;枝节点的双向指针普通B-TREE增强版BTREE(B*TREE)总结&#xff1a;从上图看出&#xff0c;在BTree上有两个头…

2010年寒假学习心得

本人的博客园博客&#xff1a;http://www.cnblogs.com/zengmiaogen 博客园是我早期发表的博文。 ------------------------------------------ 1、心态要好&#xff0c;要相信自己能完成&#xff0c;不要担心自己完成不了&#xff0c;万事开头难&#xff0c;有挫折是正常的。…

利用5w1h写出高效的git commit

创建git commit 模板 创建模板 在个人目录下&#xff0c; 创建 .gitmessage vi .gitmessage 复制代码并输入以下信息 Who: Demand maker*When: versions affected*What:The content of the code changes* descrption: * wiki/task:Why:The reason*How:Influence of change* 复制…

python高维数据_t-SNE高维数据可视化(python)

t-SNE实践——sklearn教程t-SNE是一种集降维与可视化于一体的技术&#xff0c;它是基于SNE可视化的改进&#xff0c;解决了SNE在可视化后样本分布拥挤、边界不明显的特点&#xff0c;是目前最好的降维可视化手段。关于t-SNE的历史和原理详见从SNE到t-SNE再到LargeVis。代码见下…

java数学计算表达式_Java初学者:内建函数计算简单的数学表达式

这个应该在之前写的&#xff0c;忘记了&#xff0c;补上这次我们说一下如何用java计算数学表达式的值&#xff0c;比如&#xff0c;我们要计算sin(pi/3) cos(pi/6) 5.6^3&#xff0c;怎么计算呢&#xff1f;这里我们需要用到java的math的内建函数&#xff0c;所谓内建函数&am…

你是怎样的程序员?

一、程序员A 一个善于总结、能举一反三&#xff0c;敢于承担责任&#xff0c;敢于挑战自我&#xff0c;拥抱新技术的程序员&#xff0c;他的年龄意味着丰富经验&#xff0c;意味着效率。 他能指出并带人绕过一个一个技术大坑&#xff0c;笑看风云而不掉进去&#xff1b; 他能指…

谷歌新作gVisor:VM容器融合技术已经到来

作者&#xff5c;秦承刚&#xff0c;吴启翾&#xff0c;喻望&#xff0c;杨伟 编辑&#xff5c;张婵 出处丨高效开发运维 5 月 2 日&#xff0c;谷歌发布了一款新型的沙箱容器运行时 gVisor&#xff0c;号称能够为容器提供更安全的隔离&#xff0c;同时比 VM 更轻量。容器基于共…

安卓androidstudio访问本地接口_安卓开发之数据存储在本地的四种方式

​安卓开发之数据存储在本地的四种方式本地数据存储&#xff0c;在安卓开发过程中是不可避免的一个话题。这些本地的数据可能是用户的设置&#xff0c;程序的设置&#xff0c;用户的数据图片, 也可能是网络传输的一些缓冲数据。基本上我们有4种方法可以存储安卓程序的数据。第1…

java vector 线程安全_关于Vector到底是不是 线程安全的 问题

线程安全&#xff0c;在java的多并发编程中是重要概念&#xff0c;意思是&#xff0c;多个线程同时操作一个对象&#xff0c;在各种不同情况下&#xff0c;都不会造成不同的后果。一个经典问题&#xff0c;Vector到底是不是线程安全的&#xff1f;很多人都会回答&#xff0c;是…

TypeScript 2 : 获取当前日期及前后范围日期【Array】

原文链接&#xff1a;http://blog.csdn.net/crper/article/details/55194334 --------------------------------------------------- 前言 今天有个接口字段需求&#xff0c;要写一个今天及前几天的日期传过去&#xff1b; 在网上找了下都木有什么比较好的方案&#xff1b;就…

C# Winform使用Windows Media Player播放多媒体整理

一、简单使用示例步骤 1.添加Windows Media Player 组件当前是系统的 Com组件 工具箱》右键“选择项”》选择Com组件 2.控件拖拽到桌面&#xff0c;使用 private void button1_Click(object sender, EventArgs e) {//播放开始声音axWindowsMediaPlayer2.URL "start.mp3&q…

快学Scala习题解答—第一章 基础

原文链接&#xff1a;http://blog.csdn.net/ivan_pig/article/details/8249768 --------------------------------------------------------- 1 简介 近期对Scala比较感兴趣&#xff0c;买了本《快学scala》,感觉不错。比《Programming Scala:Tackle Multi-Core Complexity on…