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 相关文章推荐
JQuery从头学起第二讲
Jul 04 Javascript
JS 实现Json查询的方法实例
Apr 12 Javascript
JavaScript实现的多个图片广告交替显示效果代码
Sep 04 Javascript
ClearTimeout消除闪动实例代码
Feb 29 Javascript
Angular 4依赖注入学习教程之ClassProvider的使用(三)
Jun 04 Javascript
vue路由跳转时判断用户是否登录功能的实现
Oct 26 Javascript
JS 数组随机洗牌的实例代码
Sep 12 Javascript
30分钟快速实现小程序语音识别功能
Nov 27 Javascript
详解微信小程序scroll-view横向滚动的实践踩坑及隐藏其滚动条的实现
Mar 14 Javascript
微信小程序防止多次点击跳转和防止表单组件输入内容多次验证功能(函数防抖)
Sep 19 Javascript
layUI使用layer.open,在content打开数据表格,获取值并返回的方法
Sep 26 Javascript
vue.js 实现a标签href里添加参数
Nov 12 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
DOTA2【瓜皮时刻】Vol.91 RTZ山史最惨“矿难”
2021/03/05 DOTA
php下使用curl模拟用户登陆的代码
2010/09/10 PHP
Linux下CoreSeek及PHP扩展模块的安装
2012/09/23 PHP
php中引用符号(&)的使用详细介绍
2016/12/06 PHP
一个cssQuery对象 javascript脚本实现代码
2009/07/21 Javascript
在javaScript中关于submit和button的区别介绍
2013/10/20 Javascript
JS中的THIS和WINDOW.EVENT.SRCELEMENT详解
2015/05/25 Javascript
javascript实现继承的简单实例
2015/07/26 Javascript
javascript中的正则表达式使用详解
2015/08/30 Javascript
vue.js+Element实现表格里的增删改查
2017/01/18 Javascript
基于JavaScript实现本地图片预览
2017/02/08 Javascript
webpack开发跨域问题解决办法
2017/08/03 Javascript
JavaScript插入排序算法原理与实现方法示例
2018/08/06 Javascript
浅谈ng-zorro使用心得
2018/12/03 Javascript
微信小程序实现bindtap等事件传参
2019/04/08 Javascript
React.js组件实现拖拽排序组件功能过程解析
2020/04/27 Javascript
[01:46]辉夜杯—打造中国DOTA新格局
2015/12/25 DOTA
python获取本机外网ip的方法
2015/04/15 Python
Python日期的加减等操作的示例
2017/08/15 Python
详解python中asyncio模块
2018/03/03 Python
python3下使用cv2.imwrite存储带有中文路径图片的方法
2018/05/10 Python
python进行两个表格对比的方法
2018/06/27 Python
Python Learning 列表的更多操作及示例代码
2018/08/22 Python
Python使用gRPC传输协议教程
2018/10/16 Python
python issubclass 和 isinstance函数
2019/07/25 Python
Python如何使用函数做字典的值
2019/11/30 Python
基于python requests selenium爬取excel vba过程解析
2020/08/12 Python
Web前端页面跳转并取到值
2017/04/24 HTML / CSS
大型会议接待方案
2014/03/01 职场文书
语文教研活动总结
2014/07/02 职场文书
国际商务专业毕业生自我鉴定2014
2014/09/27 职场文书
学院党的群众路线教育实践活动整改方案
2014/10/04 职场文书
护士长2014年度工作总结
2014/11/11 职场文书
2015年党风廉政建设责任书
2015/01/29 职场文书
北大自主招生自荐信
2015/03/04 职场文书
python画条形图的具体代码
2022/04/20 Python