如何打破 primeng 确认框消息到单独的行？

Question

谁能给我打破确认框消息的建议。

我试过下面的代码。但它将 br 标签显示为字符串。还有其他解决方法吗？

this.confirmationService.confirm({
                    message: 'CoC updated successfully' + '</br>' + ' Do you want to close or continue working with this?',
                    icon: 'fa fa-question-circle',
                    header: 'Confirm Save',
                    accept: () => {
                       this.infomessage = [];
                        this.infomessage.push({ severity: 'success', summary: '', detail: Updated Successfully' });                    },
                    reject: () => {
                        this.router.navigate(['versions']);
                    }
                });

Answer 1

我不确定这是否有效，但您可以尝试使用 DomSanitizer。像这样修改您的代码：

message: this.sanitizer.bypassSecurityTrustHtml(
'CoC updated successfully' + '</br>' + ' Do you want to close or continue working with this?'
)

在你需要之前：

import {BrowserModule, DomSanitizer} from '@angular/platform-browser'

并在构造函数中...

constructor(private sanitizer: DomSanitizer)

当您查看 PrimeNG 的源代码时...他们正在使用

[innerHTML]="message"

所以这可能行得通。

Answer 2

是的，我通过以下步骤得到它。

第 1 步

我们需要将 {{message}} 移动到 <pre> 标签内 confirmdialog.metadata.json 文件。像，

<span class=\"ui-confirmdialog-message\"><pre>{{message}}</pre></span>

第 2 步

并且我们应该在class.ui-confirmdialog-message中添加white-space: pre-line。喜欢，

.ui-confirmdialog-message {
       white-space: pre-line;
}

步骤 3

And if you add \n, then we can break the message. like, message : updated successfully \nDo you want to close or continue working with this

我希望这个回答能对某人有所帮助

Answer 3

最简单的方法是在确认对话框中添加

以使用 \n

例如：

this.confirmationService.confirm({
                    message: '<pre>CoC updated successfully\nDo you want to close or continue working with this?</pre>',
                    icon: 'fa fa-question-circle',
                    header: 'Confirm Save',
                    accept: () => {
                       this.infomessage = [];
                        this.infomessage.push({ severity: 'success', summary: '', detail: Updated Successfully' });                    },
                    reject: () => {
                        this.router.navigate(['versions']);
                    }
                });

来源：https://github.com/primefaces/primeng/issues/1310

如何打破 primeng 确认框消息到单独的行？

How to break primeng confirmation box message to separate line?

javascript

angular

typescript

element

primeng

第 1 步

第 2 步

步骤 3