Bagaimana untuk Mentafsir Templat Sudut dalam HTML Dinamik dalam AngularJS?

Berurusan dengan Tafsiran Templat Sudut dalam Ng-bind-html

Cabaran:

Dalam AngularJS, ng- Arahan bind-html membenarkan kemasukan kandungan HTML dinamik dalam templat. Walau bagaimanapun, apabila cuba memasukkan templat sudut itu sendiri, ia tetap tidak ditafsirkan, hanya muncul sebagai HTML mentah.

Penyelesaian:

Untuk mengatasi isu ini, pertimbangkan untuk menggunakan luaran arahan yang membolehkan penyusunan ungkapan Sudut dalam kandungan yang disertakan secara dinamik. Satu arahan sedemikian ialah arahan "angular-bind-html-compile" yang terdapat di https://github.com/incuna/angular-bind-html-compile.

Pelaksanaan:

1. Pasang arahan angular-bind-html-compile.
2. Masukkan arahan ke dalam modul Angular.
3. Gunakan arahan dalam templat untuk mengikat dinamik yang dikehendaki Kandungan HTML.

Contoh:

Pertimbangkan senario di mana kandungan dinamik yang diingini diperoleh daripada respons API.

Kod Pengawal:

<code class="javascript">$scope.letter = { user: { name: "John"}}</code>

Jawapan JSON:

<code class="json">{ "letterTemplate":[
    { content: "<span>Dear {{letter.user.name}},</span>" }
]}</code>

Kod Templat:

<code class="html"><div bind-html-compile="letterTemplate.content"></div></code>

Keputusan:

<code class="html"><span>Dear John,</span></code>

Kesimpulan:

Dengan memasukkan arahan "angular-bind-html-compile", pembangun boleh menyusun ungkapan Sudut yang dibenamkan dalam kandungan HTML dinamik dengan berkesan, membolehkan tafsiran templat yang sebelum ini dianggap sebagai HTML biasa.

Atas ialah kandungan terperinci Bagaimana untuk Mentafsir Templat Sudut dalam HTML Dinamik dalam AngularJS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!