13

Sto imparando Angular.js e non sono in grado di capire che cosa non va con questo semplice codice. Sembra un bell'aspetto ma mi dà un errore.

**Error**: Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.14/$injector/modulerr?p0=app&p1=Error%3A%20…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A17%3A381) 

E prima di aggiungere ng-app="app" (stavo solo mantenerla come ng-app) stava dando seguirmi errori. Perché?

Error: [ng:areq] http://errors.angularjs.org/1.3.14/ng/areq?p0=Ctrl&p1=not%20a%20function%2C%20got%20undefined 
    at Error (native) 
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:6:417 
    at Sb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:19:510) 
    at tb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:20:78) 
    at $get (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:75:331) 
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:57:65 
    at s (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:7:408) 
    at A (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:56:443) 
    at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:299) 
    at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:316) 
<!doctype html> 
    <html ng-app="app"> 
     <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 

     </head> 
     <body> 
     <div ng-controller="Ctrl"> 
      <input ng-model="name"> 
      <h1>{{name}}</h1> 
      <h2>{{age}}</h2> 
     </div> 

     <script> 
      var Ctrl = function($scope) 
      { 
       $scope.age = 24; 
      }; 
      </script> 


     </body> 
    </html> 

risposta

16

Dopo la versione AngularJS 1.3 dichiarazione di funzione di controllo globale è disabilitata

È necessario creare prima un modulo AngularJS & quindi collegare tutte le componenti per quel modulo specifico.

CODICE

function Ctrl($scope) { 
    $scope.age = 24; 
} 

angular.module('app', []) 
    .controller('Ctrl', ['$scope', Ctrl]); 

In particolare per il vostro caso, c'è qualche problema con AngularJS 1.3.14 (downgrade a 1.3.13 funziona bene). Anche se preferirei che tu usi angular 1.2.27 AngularJS 1.6.X, che è la versione più stabile & ultima versione di AngularJS.

Working Plunkr

UPDATE:

Si potrebbe fare il vostro codice attuale stato di lavoro per consentire la dichiarazione di controllo globale all'interno angular.config. Ma questo non è il modo corretto per eseguire un'applicazione angolare.

function Ctrl($scope) { 
    $scope.age = 24; 
} 

angular.module('app', []) 
    .config(['$controllerProvider', 
     function ($controllerProvider) { 
      $controllerProvider.allowGlobals(); 
     } 
    ]); 
5

È necessario definire il controller

var app = angular.module('app', []); 

app.controller('Ctrl', ['$scope',function($scope) { 
    $scope.age = 24; 
}]); 
+0

si ottiene sempre lo stesso errore – Nakib

+2

si ottiene lo stesso errore anche dopo l'aggiunta di 'ng-app =" app "'? –

5

Sono rimasto bloccato per un po 'in questo numero. Controllare seguenti in ordine: -

  1. Percorso per voi angular.js script è corretta (se si sta chiamando è nel tuo html da una fonte locale o come una risorsa esterna).

  2. Successivamente, una volta che il tuo angular.js è corretto controlla se la tua app è inizializzata o meno.

    var app=angular.module('app',[]) // nella tua app.js presentare

    <body ng-app="app"> // nel tuo html

  3. Avanti registrare il controller con l'applicazione e passare tutte le iniezioni necessarie

    app.controller('myCtrl',function(){});

  4. Chiamate il vostro file JavaScript nel file HTML

    < script src="app.js"> < /script>