Wie man einen NG-Click-Handler dynamisch hinzufügt

Question

Dec 28, 2015, 07:12 PM

Wie man einen NG-Click-Handler dynamisch hinzufügt

Ich habe versucht, einen zuvor generierten (dynamischen) Button durch Klicken mit der Maus hinzuzufügen, aber es hat nicht gut funktioniert. Auch ich habe schon alle Lösungen ausprobiert, die in diesem Forum gefunden wurden und niemand funktioniert gut.

Mein HTML-Code:

<body class="max_height" ng-app="myApp">
    <div class="container max_height" ng-controller="myCtrl">
        <div id="play" tabindex="0" ng-init="init()" ng-keydown="keyDown($event)">
            {{ content }}
        </div>
    </div>

    <script src="js/angular.min.js"></script>
    <script src="js/script.js"></script>
</body>

Mein AngularJS-Code:

var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope, $compile) {
  $scope.init = function() {
    var el = '<button class="btn" id="start" data-ng-click="startAnimation()">Start</buttom>';
    var element = angular.element(document.querySelector('#play'));
    var generated = element.html(el);
    $compile(generated)($scope);
}
$scope.startAnimation = function(){
        console.log("click");
}
});

Meine Fehlermeldung lautet "RangeError: Maximale Aufrufstapelgröße überschritten" und wird von $ compile (generated) ($ scope) generiert; . Ein weiteres Problem, das sich aus dem ersten ergibt, besteht darin, dass die Funktion startAnimation bei einem Klick auf die Schaltfläche hunderte Male ausgeführt wird.

Bitte gib mir eine Lösung. Wo ist der Fehler.