我已將以下代碼從 Ionic 3 遷移到 Ionic 5 const alert = await this.alertCtrl.create({ subHeader: "About" + " <b>" + this.user.name + "</b>", message: "Test Messgae", buttons: [ { text: 'Close', role: 'cancel', handler: () => { } } ] }); await alert.present();在 Ionic 3 中，用戶名以粗體顯示，但在 Ionic 5 中，HTML 標(biāo)簽不起作用，< b > 標(biāo)簽顯示為文本。請建議我如何在 IONIC 5 中設(shè)置警報(bào)中的文本樣式。
3 回答
侃侃無極
TA貢獻(xiàn)2051條經(jīng)驗(yàn) 獲得超10個(gè)贊
一句警告
由于 Ionic 會清理傳遞的字符串以避免不安全的 html 注入，因此會出現(xiàn) html 標(biāo)簽。攻擊者可以利用不安全的 html 來協(xié)調(diào) XSS 攻擊。
智慧大石
TA貢獻(xiàn)1946條經(jīng)驗(yàn) 獲得超3個(gè)贊
以下內(nèi)容對我有用，因?yàn)槲沂褂玫氖?IONIC 7。
@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule,
IonicModule.forRoot({ innerHTMLTemplatesEnabled: true }),
AppRoutingModule,
HttpClientModule
],
啟用內(nèi)部 HTML 模板?？赡苄枰?，因?yàn)槟?HTML 正在呈現(xiàn)為純字符串/文本。啟用此功能后，我使用的所有 HTML 標(biāo)簽都會正確呈現(xiàn)
希望這可以幫助
搖曳的薔薇
TA貢獻(xiàn)1793條經(jīng)驗(yàn) 獲得超6個(gè)贊
subHeader可以使用自定義 CSS 類加粗。在此示例中，即alertCustomClass.
主頁.ts
async presentAlertConfirm() {
const alert = await this.alertController.create({
header: 'About ' + this.test,
subHeader: this.test,
message: 'About ' + '<strong>' + this.test + '</strong>',
cssClass: 'alertCustomClass',
buttons: [
{
text: 'Cancel',
role: 'cancel',
cssClass: 'secondary',
handler: (blah) => {
console.log('Confirm Cancel: blah');
}
}, {
text: 'Okay',
handler: () => {
console.log('Confirm Okay');
}
}
]
});
await alert.present();
}
全局.scss
.alertCustomClass {
.alert-sub-title {
font-weight: bold;
}
}
另外，您可以像這樣message粗體使用：<strong>
async presentAlertConfirm() {
const alert = await this.alertController.create({
header: 'Confirm!',
message: 'About ' + '<strong>' + this.user.name + '</strong>',
buttons: [
{
text: 'Cancel',
role: 'cancel',
cssClass: 'secondary',
handler: (blah) => {
console.log('Confirm Cancel: blah');
}
}, {
text: 'Okay',
handler: () => {
console.log('Confirm Okay');
}
}
]
});
await alert.present();
}
header默認(rèn)為粗體 ( font-weight:500;)。
...
header: 'About ' + this.user.name,
message: ...,
buttons: ,,,.
...
- 3 回答
- 0 關(guān)注
- 250 瀏覽
添加回答
舉報(bào)
0/150
提交
取消