在Angular 8中,可以使用DomSanitizer
服务来解决字符串插值中的URL不可点击的问题。
首先,确保已经导入了DomSanitizer
服务:
import { DomSanitizer } from '@angular/platform-browser';
然后,在组件的构造函数中注入DomSanitizer
服务:
constructor(private domSanitizer: DomSanitizer) { }
接下来,创建一个方法来将URL字符串转换为可点击的链接:
sanitizeUrl(url: string) {
return this.domSanitizer.bypassSecurityTrustUrl(url);
}
然后,在模板中使用[innerHTML]
属性绑定,并调用上述方法来将URL字符串转换为可点击的链接:
完整的组件示例:
import { Component } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
@Component({
selector: 'app-example',
template: `
`
})
export class ExampleComponent {
url = 'https://example.com';
constructor(private domSanitizer: DomSanitizer) { }
sanitizeUrl(url: string) {
return this.domSanitizer.bypassSecurityTrustUrl(url);
}
}
这样,URL字符串就会被转换为可点击的链接。请注意,这种方法需要使用DomSanitizer
服务来绕过安全性检查,因此需要谨慎使用,确保URL是可信的。