我有一段包含链接的字符串。这些链接必须是可点击的并将用户重定向到特定页面。我已经编写了自定义管道,但我错过了这里的要点。
尝试过:
import {
Pipe,
PipeTransform
} from '@angular/core';
import {
DecimalPipe
} from '@angular/common';
@Pipe({
name: 'urlify'
})
export class UrlifyPipe implements PipeTransform {
transform(text: any): any {
var urlRegex = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
return text.replace(urlRegex, function(url) {
return '<a href="' + url + '">' + url + '</a>';
});
}
}
还有我的字符串:
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo www.sentinal.com. Aenean massa. Cum sociis http://sentinal.com et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium
结果:
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo www.sentinal.com. Aenean massa. Cum sociis <a href="http://sentinal.com">http://sentinal.com</a> et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.
正如我们所见,www.sentinal.com 和 http://sentinal.com并没有真正转换。添加了 h 标签,但这不是我想要的。任何想法的人如何实现它。我无法使用 Urlify 库,我想用自己的代码编写它。提前致谢
最佳答案
你应该这样做
<div [innerHtml]="my_model | urlify "></div>
我们必须使用innerHtml,以便它能够呈现html格式标签
关于javascript - 如何识别段落中的链接并使其可点击 Angular 2,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54472505/