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优缺点分析说明
Apr 10 Javascript
JavaScript控制Session操作方法
Jan 17 Javascript
关于include标签导致js路径找不到的问题分析及解决
Jul 09 Javascript
JavaScript中5种调用函数的方法
Mar 12 Javascript
JavaScript学习笔记之DOM基础 2.4
Aug 14 Javascript
jquery.guide.js新版上线操作向导镂空提示jQuery插件(推荐)
May 20 jQuery
jQuery上传插件webupload使用方法
Aug 01 jQuery
Vue ElementUI之Form表单验证遇到的问题
Aug 21 Javascript
js实现1,2,3,5数字按照概率生成
Sep 12 Javascript
灵活使用console让js调试更简单的方法步骤
Apr 23 Javascript
小程序组件之自定义顶部导航实例
Jun 12 Javascript
用JS实现一个简单的打砖块游戏
Dec 11 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学习笔记 数组的常用函数
2011/06/13 PHP
php设计模式之命令模式使用示例
2014/03/02 PHP
PHP入门教程之图像处理技巧分析
2016/09/11 PHP
PHP表单验证内容是否为空的实现代码
2016/11/14 PHP
JavaScript 注册事件代码
2011/01/27 Javascript
Javascript实现滚动图片新闻的实例代码
2013/11/27 Javascript
JavaScript设计模式之建造者模式介绍
2014/12/28 Javascript
Jquery 全选反选实例代码
2015/11/19 Javascript
javascript编程异常处理实例小结
2015/11/30 Javascript
plupload+artdialog实现多平台上传文件
2016/07/19 Javascript
js实现分页功能
2017/05/24 Javascript
JavaScript+HTML5实现的日期比较功能示例
2017/07/12 Javascript
微信小程序左右滑动的实现代码
2017/12/15 Javascript
10个经典的网页鼠标特效代码
2018/01/09 Javascript
微信小程序定位当前城市的方法
2018/07/19 Javascript
Vue仿微信app页面跳转动画效果
2019/08/21 Javascript
使用layer模态框给新页面传值的方法
2019/09/27 Javascript
vue 页面跳转的实现方式
2021/01/12 Vue.js
利用Python画ROC曲线和AUC值计算
2016/09/19 Python
Python AES加密模块用法分析
2017/05/22 Python
利用python批量给云主机配置安全组的方法教程
2017/06/21 Python
django模板结构优化的方法
2019/02/28 Python
python批量修改ssh密码的实现
2019/08/08 Python
Python爬虫 批量爬取下载抖音视频代码实例
2019/08/16 Python
Python实现非正太分布的异常值检测方式
2019/12/09 Python
Python3.6安装卸载、执行命令、执行py文件的方法详解
2020/02/20 Python
奇怪的鱼:Weird Fish
2018/03/18 全球购物
NHL官方在线商店:Shop.NHL.com
2020/05/01 全球购物
编写用C语言实现的求n阶阶乘问题的递归算法
2014/10/21 面试题
经典婚礼主持开场白
2014/03/13 职场文书
乡镇干部先进性教育活动个人整改措施
2014/09/16 职场文书
银行反四风对照检查材料
2014/09/29 职场文书
毕业设计论文致谢词
2015/05/14 职场文书
优秀教师主要事迹材料
2015/11/04 职场文书
导游词之蓬莱长岛
2019/12/17 职场文书
如何使用Python提取Chrome浏览器保存的密码
2021/06/09 Python