Ich bin neu in Angular und versuche herauszufinden, wie man Dinge macht ...
Wie kann ich mit AngularJS einen Controller injizieren, der in einem anderen Controller verwendet werden soll?
Ich habe das folgende Snippet:
var app = angular.module("testApp", ['']);
app.controller('TestCtrl1', ['$scope', function ($scope) {
$scope.myMethod = function () {
console.log("TestCtrl1 - myMethod");
}
}]);
app.controller('TestCtrl2', ['$scope', 'TestCtrl1', function ($scope, TestCtrl1) {
TestCtrl1.myMethod();
}]);
Wenn ich dies ausführe, erhalte ich die Fehlermeldung:
Error: [$injector:unpr] Unknown provider: TestCtrl1Provider <- TestCtrl1
http://errors.angularjs.org/1.2.21/$injector/unpr?p0=TestCtrl1Provider%20%3C-%20TestCtrl1
Sollte ich überhaupt versuchen, einen Controller in einem anderen Controller zu verwenden, oder sollte ich dies zu einem Dienst machen?
TestCtrl1
stattdessen in einen Dienst wechseln .Antworten:
Wenn Sie beabsichtigen, einen bereits instanziierten Controller einer anderen Komponente zu erhalten, und wenn Sie einen komponenten- / richtlinienbasierten Ansatz verfolgen, können Sie immer
require
einen Controller (eine Instanz einer Komponente) von einer anderen Komponente aus verwenden, die einer bestimmten Hierarchie folgt.Beispielsweise:
Die Verwendung dieser oben genannten Komponenten könnte nun ungefähr so aussehen:
Es gibt viele Möglichkeiten , wie Sie festlegen können bis erfordern .
Alte Antwort:
Sie müssen einen
$controller
Dienst einspeisen, um einen Controller in einem anderen Controller zu instanziieren. Beachten Sie jedoch, dass dies zu einigen Designproblemen führen kann. Sie können jederzeit wiederverwendbare Services erstellen, die der Einzelverantwortung folgen, und diese nach Bedarf in die Controller einfügen.Beispiel:
In jedem Fall können Sie nicht aufrufen,
TestCtrl1.myMethod()
da Sie die Methode an die$scope
und nicht an die Controller-Instanz angehängt haben .Wenn Sie den Controller gemeinsam nutzen, ist es immer besser, Folgendes zu tun:
und während des Konsums tun:
Im ersten Fall ist das wirklich
$scope
Ihr Ansichtsmodell und im zweiten Fall die Controller-Instanz selbst.quelle
var testCtrl1ViewModel = $scope.$new();
seinvar testCtrl1ViewModel = $rootScope.$new();
? Siehe : docs.angularjs.org/guide/controller @PSLIch würde vorschlagen, dass die Frage, die Sie stellen sollten, ist, wie Dienste in Controller eingefügt werden. Fat Services mit Skinny Controllern sind eine gute Faustregel, auch bekannt als Controller, um Ihren Service / Ihre Fabrik (mit der Geschäftslogik) in Ihre Ansichten zu integrieren.
Controller erhalten Müll, der bei Routenänderungen gesammelt wird. Wenn Sie beispielsweise Controller verwenden, um Geschäftslogik zu speichern, die einen Wert wiedergibt, verlieren Sie auf zwei Seiten den Status, wenn der App-Benutzer auf die Schaltfläche "Zurück" des Browsers klickt.
Hier ist eine funktionierende Demo der Fabrik, die in zwei Controller injiziert wurde
Außerdem würde ich vorschlagen, dieses Tutorial über Dienstleistungen / Fabriken zu lesen.
quelle
Es ist nicht erforderlich, Ihren Controller in JS zu importieren / zu injizieren. Sie können Ihren Controller / verschachtelten Controller einfach über Ihr HTML einfügen. Es hat bei mir funktioniert. Mögen :
quelle
Dies funktioniert am besten in meinem Fall, in dem TestCtrl2 eigene Anweisungen hat.
Dies gibt mir einen Fehler mit der Meldung scopeProvider-Injektionsfehler.
Dies funktioniert nicht wirklich, wenn Sie Direktiven in 'TestCtrl1' haben. Diese Direktive hat tatsächlich einen anderen Bereich als den hier erstellten. Sie erhalten zwei Instanzen von 'TestCtrl1'.
quelle
Die beste Lösung:-
// Hier haben Sie den ersten Controller-Aufruf erhalten, ohne ihn auszuführen
quelle
Sie können auch
$rootScope
eine Funktion / Methode des 1. Controllers vom zweiten Controller wie folgt aufrufen:quelle
Verwenden Sie Typoskript für Ihre Codierung, da es objektorientiert, streng typisiert und einfach zu pflegen ist ...
Für weitere Informationen über Typoskript klicken Sie hier
Hier ein einfaches Beispiel, das ich erstellt habe, um Daten mit Typescript zwischen zwei Controllern auszutauschen ...
}}
quelle