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 相关文章推荐
extjs grid取到数据而不显示的解决
Dec 29 Javascript
基于jquery可配置循环左右滚动例子
Sep 09 Javascript
JQuery操作tr和td内容的方法实例
Mar 06 Javascript
文字溢出实现溢出的部分再放入一个新生成的div中具体代码
May 17 Javascript
js实现的常用的左侧导航效果
Oct 17 Javascript
jquery获取URL中参数解决中文乱码问题的两种方法
Dec 18 Javascript
node.js中的console.assert方法使用说明
Dec 10 Javascript
基于javascript代码实现通过点击图片显示原图片
Nov 29 Javascript
谈谈JS中常遇到的浏览器兼容问题和解决方法
Dec 17 Javascript
Angular开发实践之服务端渲染
Mar 29 Javascript
学习jQuery中的noConflict()用法
Sep 28 jQuery
解决Layui中templet中a的onclick参数传递的问题
Sep 20 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 判断数组是几维数组
2013/03/20 PHP
php进行支付宝开发中return_url和notify_url的区别分析
2014/12/22 PHP
php导入excel文件到mysql数据库的方法
2015/01/14 PHP
php-fpm重启导致的程序执行中断问题详解
2019/04/29 PHP
ThinkPHP 5 AJAX跨域请求头设置实现过程解析
2020/10/28 PHP
javascript加号"+"的二义性说明
2013/03/04 Javascript
借助script进行Http跨域请求:JSONP实现原理及代码
2013/03/19 Javascript
Node.js中调用mysql存储过程示例
2014/12/20 Javascript
在linux中使用包管理器安装node.js
2015/03/13 Javascript
js实现密码强度检验
2017/01/15 Javascript
jquery.tableSort.js表格排序插件使用方法详解
2020/08/12 Javascript
underscore之Chaining_动力节点Java学院整理
2017/07/10 Javascript
详解Node项目部署到云服务器上
2017/07/12 Javascript
史上最全JavaScript数组去重的十种方法(推荐)
2017/08/17 Javascript
vuex2中使用mapGetters/mapActions报错的解决方法
2018/10/20 Javascript
jquery.pager.js实现分页效果
2019/07/29 jQuery
解决node.js含有%百分号时发送get请求时浏览器地址自动编码的问题
2019/11/20 Javascript
[00:17]天涯墨客一技能展示
2018/08/25 DOTA
在Django中使用Sitemap的方法讲解
2015/07/22 Python
Python实现读写sqlite3数据库并将统计数据写入Excel的方法示例
2017/08/07 Python
详解python里使用正则表达式的分组命名方式
2017/10/24 Python
python取代netcat过程分析
2018/02/10 Python
Windows下安装Django框架的方法简明教程
2018/03/28 Python
解决python3捕获cx_oracle抛出的异常错误问题
2018/10/18 Python
Python实现繁?转为简体的方法示例
2018/12/18 Python
实例介绍Python中整型
2019/02/11 Python
Python Multiprocessing多进程 使用tqdm显示进度条的实现
2019/08/13 Python
python解析命令行参数的三种方法详解
2019/11/29 Python
HTML5 虚拟键盘出现挡住输入框的解决办法
2017/02/14 HTML / CSS
小学毕业感言50字
2014/02/16 职场文书
水利局群众路线专题民主生活会发言材料
2014/09/21 职场文书
python如何在word中存储本地图片
2021/04/07 Python
Python如何配置环境变量详解
2021/05/18 Python
html实现弹窗的实例
2021/06/09 HTML / CSS
日元符号 ¥
2022/02/17 杂记
python开发人人对战的五子棋小游戏
2022/05/02 Python