Rumah > hujung hadapan web > tutorial js > Bagaimana untuk Menyusun Templat Sudut Bersarang Secara Dinamik dengan ng-bind-html?

Bagaimana untuk Menyusun Templat Sudut Bersarang Secara Dinamik dengan ng-bind-html?

Mary-Kate Olsen
Lepaskan: 2024-10-18 15:38:03
asal
545 orang telah melayarinya

How to Dynamically Compile Nested Angular Templates with ng-bind-html?

AngularJS: Menyusun Templat Sudut Bersarang dengan ng-bind-html

Isu:

Menggunakan ng-bind-html untuk memasukkan templat Sudut secara dinamik menyebabkan templat dipaparkan sebagai HTML biasa dan bukannya ditafsir dan dilaksanakan.

Penyelesaian:

Untuk menyusun Sudut templat dalam ng-bind-html, memanfaatkan arahan pihak ketiga "angular-bind-html-compile".

Pelaksanaan:

Langkah 1: Pasang arahan menggunakan:

npm install angular-bind-html-compile
Salin selepas log masuk

Langkah 2: Tambahkan arahan pada modul Angular anda:

<code class="javascript">angular.module("app", ["angular-bind-html-compile"])</code>
Salin selepas log masuk

Langkah 3: Dalam templat anda, gunakan arahan bind-html-compile pada elemen yang anda mahu masukkan HTML secara dinamik:

<code class="html"><div bind-html-compile="myDynamicHtml"></div></code>
Salin selepas log masuk
Salin selepas log masuk

Contoh:

Dalam anda pengawal:

<code class="javascript">$scope.myDynamicHtml = "<div ng-controller='myController'><span>Hello {{ myName }}</span></div>";</code>
Salin selepas log masuk

Dalam templat anda:

<code class="html"><div bind-html-compile="myDynamicHtml"></div></code>
Salin selepas log masuk
Salin selepas log masuk

Nota:

  • Arahan akan memantau perubahan dalam nilai diperuntukkan kepada atribut bind-html-compile dan susun semula HTML dengan sewajarnya.
  • Penyelesaian ini membolehkan anda memaparkan templat Sudut secara dinamik dalam ng-bind-html, tanpa mengira kandungan atau kerumitan templat.

Atas ialah kandungan terperinci Bagaimana untuk Menyusun Templat Sudut Bersarang Secara Dinamik dengan ng-bind-html?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan