angularjs通过过滤器返回超链接的方法


Posted in Javascript onOctober 26, 2018

在项目中有一个功能,需要把一段字符串拼接成一个超链接,效果如下图,

angularjs通过过滤器返回超链接的方法

从数据库中得到的字符串格式如下

angularjs通过过滤器返回超链接的方法

数据的格式很工整,以“#”和空格为标志就可以很顺利的分割,

angularjs通过过滤器返回超链接的方法

开始想象的很美好,以为直接返回就好了。

但是现实很残酷,a标签并没有变成超链接,而是变成了一个字符串

angularjs通过过滤器返回超链接的方法

检查发现并没有被转义,对这个感到不太理解

angularjs通过过滤器返回超链接的方法

之后又在网上找了找,没找到合适的办法,后来询问学长,学长高数我有一个ngBindHtml的标签,于是去看了看官方文档,用法和效果如下

angularjs通过过滤器返回超链接的方法

angularjs通过过滤器返回超链接的方法

(第三个文件夹的作用没尝试出来,不知道是干啥的)

好像效果很符合,但应该怎么使用呢,filter里面是没法用$scope的,(事后想到不一定要用filter,完全可以写一个方法直接把这个字符串转化了,虽然这样很麻烦,但确实是一个思路)

没想到好办法,只能继续问学长了,没想到方法简单到不行,angualrjs早就考虑到了,ngbindhtml可以直接使用过滤器

angularjs通过过滤器返回超链接的方法

简简单单就解决了

angularjs通过过滤器返回超链接的方法

总结

对于这个问题,事后想了想,发现还是自己考虑问题不全面,在学长告诉自己ngbindhtml后,一直纠结于他的用法,而没有想到去研究研究过滤器可以用于那些地方,是否可以在属性中。虽然已经渐渐尝试去看官方文档了,但离真正会看官方文档的道路还很长。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Prototype使用指南之string.js
Jan 10 Javascript
ExtJS DOM元素操作经验分享
Aug 28 Javascript
javascript的创建多行字符串的7种方法
Apr 29 Javascript
javascript基本算法汇总
Mar 09 Javascript
JS封装的选项卡TAB切换效果示例
Sep 20 Javascript
深入理解JavaScript中的预解析
Jan 04 Javascript
jQuery UI Grid 模态框中的表格实例代码
Apr 01 jQuery
JavaScript实现职责链模式概述
Jan 25 Javascript
JS使用canvas中的measureText方法测量字体宽度示例
Feb 02 Javascript
D3.js 实现带伸缩时间轴拓扑图的示例代码
Jan 20 Javascript
小程序实现背景音乐播放和暂停
Jun 19 Javascript
微信小程序学习之自定义滚动弹窗
Dec 20 Javascript
js使用formData实现批量上传
Mar 27 #Javascript
详解webpack打包时排除其中一个css、js文件或单独打包一个css、js文件(两种方法)
Oct 26 #Javascript
js自定义input文件上传样式
Oct 26 #Javascript
解决axios会发送两次请求,有个OPTIONS请求的问题
Oct 25 #Javascript
在Vue中使用axios请求拦截的实现方法
Oct 25 #Javascript
webpack4+react多页面架构的实现
Oct 25 #Javascript
浅谈让你的代码更简短,更整洁,更易读的ES6小技巧
Oct 25 #Javascript
You might like
NO3第三帝国留言簿制作过程
2006/10/09 PHP
php 无限级缓存的类的扩展
2009/03/16 PHP
利用Ffmpeg获得flv视频缩略图和视频时间的代码
2011/09/15 PHP
py文件转exe时包含paramiko模块出错解决方法
2016/08/12 PHP
web网页按比例显示图片实现原理及js代码
2013/08/09 Javascript
node.js中的require使用详解
2014/12/15 Javascript
JavaScript使用addEventListener添加事件监听用法实例
2015/06/01 Javascript
jquery用ajax方式从后台获取json数据后如何将内容填充到下拉列表
2015/08/26 Javascript
Angularjs的ng-repeat中去除重复数据的方法
2016/08/05 Javascript
JS+CSS3模拟溢出滚动效果
2016/08/12 Javascript
谈谈target=_new和_blank的不同之处
2016/10/25 Javascript
微信小程序实现发红包功能
2018/07/11 Javascript
vue实现行列转换的一种方法
2019/08/06 Javascript
微信小程序 搜索框组件代码实例
2019/09/06 Javascript
javascript将16进制的字符串转换为10进制整数hex
2020/03/05 Javascript
[01:34]完美“圣”典宣传片震撼发布,12.17与你不见不散
2016/12/16 DOTA
Python获取apk文件URL地址实例
2013/11/01 Python
Python 自动补全(vim)
2014/11/30 Python
python自制包并用pip免提交到pypi仅安装到本机【推荐】
2019/06/03 Python
PyQt5实现从主窗口打开子窗口的方法
2019/06/19 Python
基于plt.title无法显示中文的快速解决
2020/05/16 Python
python爬虫多次请求超时的几种重试方法(6种)
2020/12/01 Python
美国著名的品牌折扣店:Burlington
2017/06/08 全球购物
英国珠宝网站Argento: PANDORA、Olivia Burton和Nomination等
2020/05/08 全球购物
.NET里面什么时候需要调用垃圾回收
2015/06/01 面试题
市场营销专业推荐信
2013/11/03 职场文书
应届大学生求职的自我评价
2013/11/17 职场文书
国贸专业个人求职信分享
2013/12/04 职场文书
商场端午节活动方案
2014/01/29 职场文书
四年级下册教学反思
2014/02/01 职场文书
国际贸易毕业生求职信
2014/07/20 职场文书
整改报告怎么写
2014/11/06 职场文书
数学教师个人工作总结
2015/02/06 职场文书
检讨书模板大全
2015/05/07 职场文书
React-vscode使用jsx语法的问题及解决方法
2021/06/21 Javascript
Linux系统下安装PHP7.3版本
2021/06/26 PHP