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 相关文章推荐
JavaScript 题型问答有答案参考
Feb 17 Javascript
JavaScript高级程序设计 扩展--关于动态原型
Nov 09 Javascript
遍历js中对象的属性和值的实例
Nov 21 Javascript
ES6生成器用法实例分析
Apr 10 Javascript
实现单层json按照key字母顺序排序的示例
Dec 06 Javascript
关于ES6箭头函数中的this问题
Feb 27 Javascript
vue input输入框模糊查询的示例代码
May 22 Javascript
vuejs 动态添加input框的实例讲解
Aug 24 Javascript
vue实现的双向数据绑定操作示例
Dec 04 Javascript
原生JS实现的跳一跳小游戏完整实例
Jan 27 Javascript
node.js如何根据URL返回指定的图片详解
Oct 21 Javascript
Vue select 绑定动态变量的实例讲解
Oct 22 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
zend api扩展的php对象的autoload工具
2011/04/18 PHP
php微信公众平台开发类实例
2015/04/01 PHP
php多进程应用场景实例详解
2019/07/22 PHP
广告显示判断
2006/08/31 Javascript
扩展jQuery对象时如何扩展成员变量具体怎么实现
2014/04/25 Javascript
Eclipse引入jquery报错如何解决
2015/12/01 Javascript
javascript学习指南之回调问题
2016/04/23 Javascript
BootStrap selectpicker后台动态绑定数据
2017/06/01 Javascript
JavaScript中正则表达式使数字、中文或指定字符高亮显示
2017/10/31 Javascript
Vue.js 中 axios 跨域访问错误问题及解决方法
2018/11/21 Javascript
200行HTML+JavaScript实现年会抽奖程序
2019/01/22 Javascript
详解React项目中碰到的IE问题
2019/03/14 Javascript
Python格式化css文件的方法
2015/03/10 Python
Python通过正则表达式选取callback的方法
2015/07/18 Python
python 产生token及token验证的方法
2018/12/26 Python
Python考拉兹猜想输出序列代码实践
2019/07/05 Python
python原类、类的创建过程与方法详解
2019/07/19 Python
Python 转换RGB颜色值的示例代码
2019/10/13 Python
python进程间通信Queue工作过程详解
2019/11/01 Python
使用python切片实现二维数组复制示例
2019/11/26 Python
适合Python初学者的一些编程技巧
2020/02/12 Python
Python编程快速上手——疯狂填词程序实现方法分析
2020/02/29 Python
浅谈keras 的抽象后端(from keras import backend as K)
2020/06/16 Python
HTML5 Canvas 实现K线图的示例代码
2019/12/23 HTML / CSS
俄罗斯街头服装品牌:Black Star Wear
2017/03/01 全球购物
国际贸易专业个人求职信范文分享
2013/12/14 职场文书
4s店机修工岗位职责
2013/12/20 职场文书
会计出纳员的自我评价
2014/01/15 职场文书
应届生自荐书
2014/06/23 职场文书
公司股东合作协议书
2014/09/14 职场文书
房屋租赁协议书(标准版)
2014/10/02 职场文书
关于运动会广播稿300字
2014/10/05 职场文书
2015年大学辅导员工作总结
2015/05/12 职场文书
家庭经济困难证明
2015/06/23 职场文书
创业计划书之珠宝饰品
2019/08/26 职场文书
JavaScript实现队列结构过程
2021/12/06 Javascript