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 相关文章推荐
js cookies实现简单统计访问次数
Nov 24 Javascript
再谈javascript面向对象编程
Mar 18 Javascript
jquery+ajax+C#实现无刷新操作数据库数据的简单实例
Feb 08 Javascript
点击标签切换和自动切换DIV选项卡
Aug 10 Javascript
JavaScript框架是什么?怎样才能叫做框架?
Jul 01 Javascript
JavaScript jquery及AJAX小结
Jan 24 Javascript
浏览器复制插件zeroclipboard使用指南
Mar 26 Javascript
js模态对话框使用方法详解
Feb 16 Javascript
vue中计算属性(computed)、methods和watched之间的区别
Jul 27 Javascript
微信小程序 功能函数小结(手机号验证*、密码验证*、获取验证码*)
Dec 08 Javascript
javascript与PHP动态往类中添加方法对比
Mar 21 Javascript
Js中使用正则表达式验证输入是否有特殊字符
Sep 07 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
PHP print类函数使用总结
2010/06/25 PHP
PHP实现将科学计数法转换为原始数字字符串的方法
2014/12/16 PHP
php版微信自动获取收货地址api用法示例
2016/09/22 PHP
JS实现self的resend
2010/07/22 Javascript
js解析xml字符串和xml文档实现原理及代码(针对ie与火狐)
2013/02/02 Javascript
Javascript 绘制 sin 曲线过程附图
2014/08/21 Javascript
通过Tabs方法基于easyUI+bootstrap制作工作站
2016/03/28 Javascript
JS不用正则验证输入的字符串是否为空(包含空格)的实现代码
2016/06/14 Javascript
Vue.js每天必学之数据双向绑定
2016/09/05 Javascript
vue.js初学入门教程(2)
2016/11/07 Javascript
element ui table(表格)实现点击一行展开功能
2018/12/04 Javascript
利用Vue-draggable组件实现Vue项目中表格内容的拖拽排序
2019/06/07 Javascript
js中比较两个对象是否相同的方法示例
2019/09/02 Javascript
vue父子模板传值问题解决方法案例分析
2020/02/26 Javascript
[02:45]2016年中国刀塔全程回顾,完美“圣”典即将上演
2016/12/15 DOTA
Python 检查数组元素是否存在类似PHP isset()方法
2014/10/14 Python
python爬虫入门教程--快速理解HTTP协议(一)
2017/05/25 Python
python微信跳一跳系列之色块轮廓定位棋盘
2018/02/26 Python
Python3实现爬虫爬取赶集网列表功能【基于request和BeautifulSoup模块】
2018/12/05 Python
python3实现多线程聊天室
2018/12/12 Python
Python3.5 + sklearn利用SVM自动识别字母验证码方法示例
2019/05/10 Python
对Python中一维向量和一维向量转置相乘的方法详解
2019/08/26 Python
Python同时迭代多个序列的方法
2020/07/28 Python
Styleonme中文网:韩国高档人气品牌
2017/06/21 全球购物
Hertz荷兰:荷兰和全球租车
2018/01/07 全球购物
Baracuta官方网站:Harrington夹克,G9,G4,G10等
2018/03/06 全球购物
英国高街电视:High Street TV
2018/05/22 全球购物
毕业生求职信的经典写法
2014/01/31 职场文书
职员竞岗演讲稿
2014/05/14 职场文书
机关作风建设心得体会
2014/10/22 职场文书
不同意离婚上诉状
2015/05/23 职场文书
宿舍管理制度范本
2015/08/07 职场文书
2016感恩母亲节校园广播稿
2015/12/17 职场文书
MySQL 全文检索的使用示例
2021/06/07 MySQL
idea搭建可运行Servlet的Web项目
2021/06/26 Java/Android
MySQL命令无法输入中文问题的解决方式
2021/08/30 MySQL