web-dev-qa-db-de.com

AngularJS ng-Controller funktioniert nicht

Ich habe gerade angefangen, auf AngularJS von w3schools zu lernen. Ich versuche, Beispiele zu üben, was auch immer sie in den Tutorials erwähnt haben. Alles funktioniert gut, aber wenn ich zu "AngularJS Controllers" kam, funktioniert es nicht richtig, da es gut funktioniert in w3schools Try it Yourself » . Ich habe meinen Code in dieses Geige-Beispiel ..__ eingeteilt. Mein Skript sieht folgendermaßen aus:

function personController($scope) {
    $scope.firstName= "John";
    $scope.lastName= "Doe";
}

Versuchen Sie mir zu helfen und schlagen Sie mir ein gutes Tutorial (oder eine kostenlose PDF-Datei) vor.

javascripthtmlangularjsangularjs-controller
21
UiUx

Dies ist Ihre korrigierte Geige.

Es ist eine bewährte Methode für das Angleichen, dass die Controller-Definition in etwa wie folgt aussehen muss:

angular.module("app", []).controller("personController", function($scope) {
    $scope.firstName = "John";
    $scope.lastName = "Doe";
});

Und ohne Zweifel ist das beste Tutorial, das Sie je für das Erlernen des Grundlagenvon Angular gelernt haben, das CodeSchool!

Hoffe das hilft.

22
Kutyel

Es ist ein neuer Ansatz. Controller können ohne Modul nicht mehr verwendet werden. Schauen Sie sich this an. Fügen Sie einfach ein Modul hinzu und hängen Sie den Controller an, dann haben Sie kein Problem.

11
katmanco

Ich habe gerade deine Js-Geige geändert. Bitte überprüfen Sie das Geige-Beispiel

function personController($scope) {
    $scope.firstName= "John";
    $scope.lastName= "Doe";
}

Mit Ihrem Code ist kein Problem aufgetreten, mit Ausnahme der JS-Geigeneinstellungen von onLoad nach No wrap-in head

enter image description here

5
khichar.anil

Sie müssen die Funktion als Parameter innerhalb des Moduls eingeben

var app = angular.module('app',[]);
app.controller('personController',function($scope){
  $scope.firstName = 'John';
  $scope.lastName = 'Smith';
});
1
latifalbr

durch Hinzufügen von np-app="myApp" in einem beliebigen Tag von html wie<html ng-app = "myApp">mein Code funktioniert einwandfrei.

1
Samreen Quyyum

Sie müssen ein Anwendungsmodul erstellen und dann einen Controller hinzufügen. Im Winkel geht es nur um Abhängigkeiten. Zweitens benötigen Sie einen App-Namen . Das Basistutorial befindet sich auf der Hauptseite: https://docs.angularjs.org/tutorial/step_00 Ich habe damit angefangen und es hat gut funktioniert mir. Führen Sie einfach alle Schritte ab Schritt 1 aus.

1
Beri

Dies ist ein allgemeines Suchergebnis für "Angular Controller, das nicht funktioniert". Ich dachte, es wäre hilfreich, die Lösung hinzuzufügen, durch die das Problem "Controller nicht funktioniert" behoben wurde.

Ich hatte meine Basisroute mit $routeProvider, die auf eine Controller-Datei zeigte, und eine templateUrl-Partition wie folgt:

$routeProvider.when('/', {
    templateUrl: 'partials/home.html',
    controller: 'homePage'
});

Ich hatte mehrere andere Routen und alle diese Controller funktionierten, aber aus irgendeinem Grund war meine erste Route nicht der Fall. Es stellte sich heraus, dass ich einen kleinen logischen Fehler in meinem Partial hatte und dass ANY meines Controller-Codes nicht ausgeführt werden konnte.

Dummer kleiner Fehler, aber ich wurde überrascht, dass es ein logisches Problem in meinem Partial war, das die Ausführung von Controller-Code verhinderte. Es hat viel länger gedauert, als ich zugeben möchte, weil das Problem nicht in meinem "JavaScript" war, obwohl die Konsolenfehler vorhanden waren. Die Freuden eines eng gekoppelten Front-End-Codes?

1
Benjamin Solum

Dasselbe Problem kann auftreten, wenn Sie versuchen, App in einer anderen ngApp zu verschachteln.

Die Dokumentation sagt:

AngularJS applications cannot be nested within each other.

0
Yevgeniy Afanasyev