英文:
Angular render HTML inside property values
问题
export const message {
'comment.require.error2': '响应已选择为 <b>NO</b>,您必须提供评论以支持它',
}
<small class="lmn-text-danger">
{{ message['comment.require.error2'] | raw }}
</small>
英文:
message.properties.ts
export const message {
'comment.require.error2': 'The response has been chosen as <b>NO</b>, you must provide comments to support it',
}
HTML
<small class="lmn-text-danger">
{{ message['comment.require.error2'] }}
</small>
How can I render NO
as bold, when I try to use this way it also renders HTML(<b>NO</b>)
答案1
得分: 1
使用innerHTML
来渲染字符串为HTML,而不是使用字符串插值来渲染为纯文本:
<small class="lmn-text-danger" [innerHTML]="message['comment.require.error2']"></small>
此外,由于这会向DOM添加元素,存在安全风险,建议使用DOMSanitizer进行安全处理。
使用管道的示例:https://stackoverflow.com/questions/47528311/angular-5-sanitizing-html-with-pipe
英文:
Use innerHTML
to render string as HTML instead of plain text with string interpolation:
<small class="lmn-text-danger" [innerHTML]="message['comment.require.error2']"></small>
Also, as this adds elements to the DOM, which poses security risk, it is advisable to sanitize it with DOMSanitizer
Example using pipe: https://stackoverflow.com/questions/47528311/angular-5-sanitizing-html-with-pipe
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论