Call eckigen Funktion auf Dokument bereit

Question

Gibt es eine Möglichkeit, Winkelfunktion von Javascript-Funktion aufrufen?

function AngularCtrl($scope) { 
    $scope.setUserName = function(student){ 
    $scope.user_name = 'John'; 
    } 
} 

Ich brauche die folgende Funktionalität in meinem html:

jQuery(document).ready(function(){ 
    AngularCtrl.setUserName(); 
} 

Das Problem hier ist mein HTML-Code vorhanden ist, wenn Seite geladen wird und damit die ng Richtlinien im html nicht kompiliert. also möchte ich $ kompilieren (jQuery ("PopupID")); wenn das DOM geladen ist.

Gibt es eine Möglichkeit, eine Winkelfunktion für das Dokument bereit zu machen? Kann mir jemand dabei helfen?

Answer 1

Angular hat eine eigene Funktion zum Testen auf Dokument bereit. Sie könnten eine manuelle Bootstrap tun und dann die Benutzername:

angular.element(document).ready(function() { 
    var $injector = angular.bootstrap(document, ['myApp']); 
    var $controller = $injector.get('$controller'); 
    var AngularCtrl = $controller('AngularCtrl'); 
    AngularCtrl.setUserName(); 
}); 

Dazu Sie die ng-App-Direktive vom html entfernen müssen arbeiten.

Answer 2

Die Antwort oben, obwohl korrekt, ist ein Anti-Pattern. In den meisten Fällen, wenn Sie das DOM modifizieren oder warten wollen, bis das DOM lädt und dann Sachen macht (Dokument bereit), tun Sie es nicht im Controller, sondern in der Link-Funktion.

angular.module('myModule').directive('someDirective', function() { 
    return { 
    restrict: 'E', 
    scope: { 
     something: '=' 
    }, 
    templateUrl: 'stuff.html', 
    controller: function($scope, MyService, OtherStuff) { 
     // stuff to be done before the DOM loads as in data computation, model initialisation... 
    }, 
    link: function (scope, element, attributes) 
     // stuff that needs to be done when the DOM loads 
     // the parameter element of the link function is the directive's jqlite wraped element 
     // you can do stuff like element.addClass('myClass'); 
     // WARNING: link function arguments are not dependency injections, they are just arguments and thus need to be given in a specific order: first scope, then element etc. 
    } 
    }; 
}); 

In aller Ehrlichkeit, gilt die Verwendung von $ Dokument oder angular.element extrem selten (nicht in der Lage, eine Richtlinie statt nur einem Controller zu verwenden) und in den meisten Fällen der Überprüfung Ihr Design besser sind.

PS: Ich weiß, dass diese Frage alt ist, aber noch einige Best Practices hervorheben musste. :)