web-dev-qa-db-fra.com

Le contrôleur AngularJS ng ne fonctionne pas

Je viens tout juste de commencer à apprendre AngularJS à partir de w3schools . J'essaie de mettre en pratique des exemples de ce qu'ils ont mentionné dans les tutoriels. Tout fonctionne bien, mais lorsque je suis arrivé à "AngularJS Controllers", il ne fonctionne pas correctement car il fonctionne bien dans w3schools Essayez-le vous-même » . J'ai introduit mon code dans cet exemple fiddle . Mon script ressemble à ceci:

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

Essayez de m'aider et de me suggérer un bon tutoriel (ou n'importe quel fichier pdf gratuit).

javascripthtmlangularjsangularjs-controller
21
UiUx

Ceci est votre violon corrigé.

C'est une bonne pratique pour angular que la définition du contrôleur doit ressembler à ceci:

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

Et, sans aucun doute, le meilleur tutoriel de tous les temps pour apprendre les bases de Angular est celui-ci CodeSchool!

J'espère que cela t'aides.

22
Kutyel

C'est une nouvelle approche. Nous ne pouvons plus utiliser de contrôleurs sans module. Regardez cela . Il suffit d’ajouter un module et d’ajouter le contrôleur pour ne poser aucun problème.

11
katmanco

Je viens de modifier ton violon js. S'il vous plaît vérifier le exemple de violon

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

Votre code n’a posé aucun problème, à l’exception des paramètres de violon JS de onLoad à No wrap-in head

enter image description here

5
khichar.anil

Vous devez entrer une fonction en tant que paramètre dans le module

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

en ajoutant np-app="myApp" dans n’importe quelle balise HTML comme<html ng-app = "myApp">mon code fonctionne bien.

1
Samreen Quyyum

Vous devez créer un module d'application, puis lui ajouter un contrôleur. En angulaire, tout est question de dépendances. Deuxièmement, vous avez besoin d’un nom d’application . Le didacticiel de base se trouve sur leur page principale: https://docs.angularjs.org/tutorial/step_00 moi. Il suffit de faire toutes les étapes à partir de l’étape 1.

1
Beri

Ceci est un résultat de recherche courant pour "Le contrôleur angulaire ne fonctionne pas", j'ai donc pensé qu'il serait utile d'ajouter la solution qui a résolu le problème "Le contrôleur ne fonctionne pas".

J'ai eu ma route de base avec $routeProvider pointant vers un fichier de contrôleur et un partial de templateUrl comme ceci:

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

J'avais plusieurs autres itinéraires et tous ces contrôleurs fonctionnaient, mais pour une raison quelconque, mon premier itinéraire ne fonctionnerait pas. Il s'est avéré que j'avais une petite erreur de logique dans mon partiel et que cela empêchait TOUS les codes de mon contrôleur de s'exécuter.

Petite erreur stupide, mais j'ai été pris au dépourvu qu'il s'agissait d'un problème de logique dans ma partie qui empêchait tout code de contrôleur de s'exécuter. Il a fallu beaucoup plus de temps que ce que j'aimerais admettre, car le problème ne figurait pas dans mon "JavaScript", même si les erreurs de la console étaient présentes. Les joies du code frontal étroitement couplé, une nuit?

1
Benjamin Solum

Le même problème peut se poser si vous essayez d'imbriquer une application dans une autre application.

La documentation dit:

AngularJS applications cannot be nested within each other.

0
Yevgeniy Afanasyev