Paparkan kandungan lain dan innerHTML secara serentak
P粉727531237
P粉727531237 2024-03-22 10:59:42
0
1
381

Saya mempunyai komponen yang membuat label berdasarkan data yang diluluskan seperti ini:

<ng-container>
<ng-container [ngSwitch]="tag">
    <p    *ngSwitchCase="'p'"  [innerHTML]="_getString()"></p>
    <h1   *ngSwitchCase="'h1'" [innerHTML]="_getString()"></h1>
    <h2   *ngSwitchCase="'h2'" [innerHTML]="_getString()"></h2>
    <h3   *ngSwitchCase="'h3'" [innerHTML]="_getString()"></h3>
    <h4   *ngSwitchCase="'h4'" [innerHTML]="_getString()"></h4>
    <span *ngSwitchCase="'span'" [innerHTML]="_getString()"></span>
    <code *ngSwitchCase="'code'" [innerHTML]="_getString()"></code>
    <time *ngSwitchCase="'time'" [innerHTML]="_getString()"></time>
</ng-container>

Saya mahu memaparkan ikon di sebelah setiap teks apabila diperlukan.

<span *ngIf="icon" class="css-{{icon}}" role="presentation"></span>

Jika saya meletakkan teg ikon di antara setiap teg, ia akan digantikan dengan data innerHTML.

Adakah terdapat cara untuk memaparkan ikon (menggunakan ng-content atau sesuatu yang serupa, kerana saya tidak mahu menulis ikon html dalam setiap elemen) dan data innerHTML?

Saya baru dalam dunia Angular jadi saya cuba belajar. Sebarang bantuan amatlah dihargai.

Terima kasih.

P粉727531237
P粉727531237

membalas semua(1)
P粉731977554

Nampaknya isu anda bukan khusus Sudut, tetapi tingkah laku JavaScript.

innerHTML Mendapat atau menetapkan teg HTML atau XML yang terkandung dalam elemen. Jadi ini bermakna ia menggantikan apa sahaja yang ada di tempat pertama. (https://developer.mozilla.org/en-US /docs/Web/API/Element/innerHTML)

Saya rasa anda boleh cuba menggunakan insertAdjacentHTML() sebaliknya - ini sepatutnya menambahkan HTML pada elemen yang sudah ada dalam DOM. Semak sintaks dan contoh di sini: https://developer.mozilla.org/en-US/docs/Web/API/Element/insertAdjacentHTML

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan