Heim > Artikel > Web-Frontend > Implementieren Sie die dynamische Kompilierung von Methoden, die über AngularJS zu dom hinzugefügt wurden
Das Beispiel in diesem Artikel beschreibt, wie AngularJS die dynamische Kompilierung implementiert und zum Dom hinzufügt. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:
Bei der Verwendung von AngularJS hoffe ich, die Angular-Vorlage dynamisch zu erstellen und sie dann über Angular anzuzeigen. Die Verwendungsmethode von
ist wie folgt:
<html ng-app="app"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <script src="assets/angular.min.js"></script> <script src="assets/js/jquery.min.js"></script> <script src="assets/js/handlebars.min.js"></script> <script src="assets/Handlebars.helper.js"></script> <script > var app=angular.module("app",[]); app.controller('ctrl', ['$scope','$compile',function($scope,$compile){ $scope.userName='RAY'; $scope.test = function test(){ console.log('你好:' +$scope.userName); } //通过$compile动态编译html var html="<button ng-click='test()'>{{userName}}</button>"; var template = angular.element(html); var mobileDialogElement = $compile(template)($scope); angular.element(document.body).append(mobileDialogElement); }]); </script> </head> <body ng-controller="ctrl"> </body> </html>
var html="<button ng-click='test()'>{{userName}}</button>";
Diese Art von Code ist die Angular-Vorlage. Durch Kompilieren mit dem AngularJS-Compiler können Sie auf die Objektdaten zugreifen der Winkelumfang.
Das Obige ist der Inhalt der Methode der dynamischen Kompilierung und Hinzufügung von AngularJS zum Dom. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!
Verwandte Artikel:
AngularJS generiert dynamisch Div-IDs
AngularJs lädt Module und Abhängigkeiten dynamisch
AngularJS implementiert die Methode zum Binden von Ereignissen an dynamisch generierte Elemente