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每次Title显示不同的名言
Sep 25 Javascript
javascript 子窗体父窗体相互传值方法
May 31 Javascript
IE之动态添加DOM节点触发window.resize事件
Jul 27 Javascript
创建你的第一个AngularJS应用的方法
Jun 16 Javascript
详解AngularJS中的作用域
Jun 17 Javascript
js贪吃蛇网页版游戏特效代码分享(挑战十关)
Aug 24 Javascript
如何解决jQuery EasyUI 已打开Tab重新加载问题
Dec 19 Javascript
字太多用...代替的方法(两种)
Mar 15 Javascript
babel的使用及安装配置教程
Feb 22 Javascript
10分钟上手vue-cli 3.0 入门介绍
Apr 04 Javascript
JS实现的简单下拉框联动功能示例
May 11 Javascript
JS实现手写 forEach算法示例
Apr 29 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中使用Oracle数据库(4)
2006/10/09 PHP
smarty模板嵌套之include与fetch性能测试
2010/12/05 PHP
[原创]解决wincache不支持64位PHP5.5/5.6的问题(提供64位wincache下载)
2016/06/22 PHP
PHP中多线程的两个实现方法
2016/10/14 PHP
php生成网页桌面快捷方式
2017/05/05 PHP
Extjs TriggerField在弹出窗口显示不出问题的解决方法
2010/01/08 Javascript
在JavaScript里嵌入大量字符串常量的实现方法
2013/07/07 Javascript
js验证身份证号有效性并提示对应信息
2015/10/19 Javascript
基于jquery实现的仿优酷图片轮播特效代码
2016/01/13 Javascript
超链接怎么正确调用javascript函数
2016/05/23 Javascript
JavaScript中数组的22种方法必学(推荐)
2016/07/20 Javascript
JS判断浏览器是否安装flash插件的简单方法
2016/09/13 Javascript
$.browser.msie 为空或不是对象问题的多种解决方法
2017/03/19 Javascript
深入理解nodejs中Express的中间件
2017/05/19 NodeJs
详解JS获取HTML DOM元素的8种方法
2017/06/17 Javascript
JS实现网页抢购功能(触发,终止脚本)
2017/11/27 Javascript
javaScript中"=="和"==="的区别详解
2018/03/16 Javascript
ES6使用export和import实现模块化的方法
2018/09/10 Javascript
Vue.js@2.6.10更新内置错误处机制Fundebug同步支持相应错误监控
2019/05/13 Javascript
webpack的tree shaking的实现方法
2019/09/18 Javascript
JavaScript前后端JSON使用方法教程
2020/11/23 Javascript
python装饰器与递归算法详解
2016/02/18 Python
Python安装模块的常见问题及解决方法
2018/02/05 Python
Python 实现在文件中的每一行添加一个逗号
2018/04/29 Python
python使用requests模块实现爬取电影天堂最新电影信息
2019/04/03 Python
python学习--使用QQ邮箱发送邮件代码实例
2019/04/16 Python
Python进程,多进程,获取进程id,给子进程传递参数操作示例
2019/10/11 Python
tensorflow保持每次训练结果一致的简单实现
2020/02/17 Python
Python tkinter布局与按钮间距设置方式
2020/03/04 Python
董事长职责范文
2013/11/08 职场文书
歌唱比赛主持词
2014/03/18 职场文书
开平碉楼导游词
2015/02/06 职场文书
2015年秋季灭鼠工作总结
2015/07/27 职场文书
浅谈Redis主从复制以及主从复制原理
2021/05/29 Redis
css3应用示例:新增的选择器
2022/03/16 HTML / CSS
sqlserver连接错误之SQL评估期已过的问题解决
2022/03/23 SQL Server