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 相关文章推荐
图片之间的切换
Jun 26 Javascript
javascript 特性检测并非浏览器检测
Jan 15 Javascript
纯JavaScript实现获取onclick、onchange等事件的值
Dec 29 Javascript
jQuery实现右侧显示可向左滑动展示的深色QQ客服效果代码
Oct 23 Javascript
AngularJs实现ng1.3+表单验证
Dec 10 Javascript
基于JavaScript代码实现兼容各浏览器的设为首页和加入收藏
Jan 07 Javascript
Js与Jq获取浏览器和对象值的方法
Mar 18 Javascript
ionic cordova一次上传多张图片(类似input file提交表单)的实现方法
Dec 16 Javascript
BootStrap Fileinput插件和Bootstrap table表格插件相结合实现文件上传、预览、提交的导入Excel数据操作步骤
Aug 07 Javascript
JavaScript实现读取与输出XML文件数据的方法示例
Jun 05 Javascript
js实现敏感词过滤算法及实现逻辑
Jul 24 Javascript
24行JavaScript代码实现Redux的方法实例
Nov 17 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
文件系统基本操作类
2006/11/23 PHP
php 代码优化的42条建议 推荐
2009/09/25 PHP
如何获知PHP程序占用多少内存(memory_get_usage)
2012/09/23 PHP
php删除与复制文件夹及其文件夹下所有文件的实现代码
2013/01/23 PHP
解析php中如何调用用户自定义函数
2013/08/06 PHP
ThinkPHP文件上传实例教程
2014/08/22 PHP
Yii框架中 find findAll 查找出制定的字段的方法对比
2014/09/10 PHP
[原创]php逐行读取txt文件写入数组的方法
2015/07/02 PHP
PHP导出Excel实例讲解
2016/01/24 PHP
Nginx环境下PHP flush失效的解决方法
2016/10/19 PHP
php解决crontab定时任务不能写入文件问题的方法分析
2019/09/16 PHP
asp(javascript)全角半角转换代码 dbc2sbc
2009/08/06 Javascript
加载远程图片时,经常因为缓存而得不到更新的解决方法(分享)
2013/06/26 Javascript
js中arguments的用法(实例讲解)
2013/11/30 Javascript
jquery设置按钮停顿3秒不可用
2014/03/07 Javascript
通过伪协议解决父页面与iframe页面通信的问题
2015/04/05 Javascript
JavaScript实现将数组数据添加到Select下拉框的方法
2015/08/21 Javascript
jquery实现弹出层登录和全屏层注册特效
2015/08/28 Javascript
js性能优化技巧
2015/11/29 Javascript
AngularJS解决ng-if中的ng-model值无效的问题
2017/06/21 Javascript
微信小程序动态设置图片大小的方法
2019/11/21 Javascript
[01:14:31]Secret vs VG 2018国际邀请赛淘汰赛BO3 第一场 8.23
2018/08/24 DOTA
老生常谈python函数参数的区别(必看篇)
2017/05/29 Python
Python利用Django如何写restful api接口详解
2018/06/08 Python
浅谈Python中的模块
2020/06/10 Python
Python logging模块异步线程写日志实现过程解析
2020/06/30 Python
Python生成pdf目录书签的实例方法
2020/10/29 Python
eBay法国购物网站:eBay.fr
2017/10/21 全球购物
家属慰问信
2015/02/14 职场文书
投资申请报告
2015/05/19 职场文书
教师培训简讯
2015/07/20 职场文书
幼儿园大班教师随笔
2015/08/14 职场文书
2016个人廉洁自律承诺书
2016/03/25 职场文书
小公司融资,商业计划书的8切记
2019/07/15 职场文书
MySQL表锁、行锁、排它锁及共享锁的使用详解
2022/04/02 MySQL
Zabbix对Kafka topic积压数据监控的解决方案
2022/07/07 Servers