2016-04-13 5 views
2

Ich versuche ein Beispiel mit AngularJS zu Evaluierungsausdrücken zu testen, aber ein Fehler wird angezeigt: 'Uncaught ReferenceError: angular ist nicht definiert' (anonyme Funktion) Ich habe zwei Dateien : index.html und expression.js index.html:Uncaught ReferenceError: angular ist nicht definiert (anonyme Funktion)

<script src="/home/mohamed/Desktop/AngularJS/expression.js"></script> 
     <script src="/home/mohamed/Desktop/AngularJS/angular.min.js"></script> 


<div ng-controller="ExampleController" class="expressions"> 
    Expression: 
    <input type='text' ng-model="expr" size="80"/> 
    <button ng-click="addExp(expr)">Evaluate</button> 
    <ul> 
    <li ng-repeat="expr in exprs track by $index"> 
    [ <a href="" ng-click="removeExp($index)">X</a> ] 
    <code>{{expr}}</code> => <span ng-bind="$parent.$eval(expr)"></span> 
    </li> 
    </ul> 
</div> 

expression.js:

angular.module('expressionExample', []).controller('ExampleController', ['$scope', function($scope) { 
    var exprs = $scope.exprs = []; 
    $scope.expr = '3*10|currency'; 
    $scope.addExp = function(expr) { 
    exprs.push(expr); 
    }; 

    $scope.removeExp = function(index) { 
    exprs.splice(index, 1); 
    }; 
}]); 
+2

Mögliche Duplikat [Was ist die Ursache für "Winkel nicht definiert ist"] (http://stackoverflow.com/questions/ 18044519/was-ist-die-Ursache-für-eckig-ist-nicht-definiert) – Xufox

Antwort

0

Das Problem ist, in die Datei ‚index.html‘

Erstens: die gehören der Quelle ‚angularjs.min.js‘ geschrieben werden muss, bevor die sind von ‚expression.js‘

Dann: Sie sollten die ng-app = 'expressionExample'; für exemple in die balise html

Dies ist die Korrektur:

<html ng-app='expressionExample'> 
<script src="/home/mohamed/Desktop/AngularJS/angular.min.js"></script> 

    <script src='/home/mohamed/Desktop/AngularJS/expression.js'></script>  

<div ng-controller="ExampleController" class="expressions"> 
    Expression: 
    <input type='text' ng-model="expr" size="80"/> 
    <button ng-click="addExp(expr)">Evaluate</button> 
    <ul> 
    <li ng-repeat="expr in exprs track by $index"> 
    [ <a href="" ng-click="removeExp($index)">X</a> ] 
    <code>{{expr}}</code> => <span ng-bind="$parent.$eval(expr)"></span> 
    </li> 
    </ul> 
</div> 
</html> 
0

Sie das Skript ausführen, bevor Sie sich Angular umfassen.

Das wird nicht funktionieren.

+0

so kann ich korrigieren? Ich bin ein Anfänger bei Angularjs –

+0

Sie können Angular nicht verwenden, bevor Sie die Angular-Skriptdatei ausführen. – SLaks

3

Nehmen Sie diese Änderung

<script src="/home/mohamed/Desktop/AngularJS/angular.min.js"></script> 
<script src="/home/mohamed/Desktop/AngularJS/expression.js"></script> 

Der Grund Ihrer expression.js ist auf angualarjs Rahmen abhängt. Wenn Sie angular.module tun, sucht es nach einer Schnittstelle zum Konfigurieren der Module. Da der Ausdruck js vor angularjs geladen wird, kann er die Schnittstelle nicht finden.

Dies gilt gleichermaßen für andere Bibliothek & Framework. Wenn Ihre js Datei Abhängigkeit von Bibliothek wie jquery die jquery.js Datei sollte vor Ihrer benutzerdefinierten Dateien

Sie bei asynchronous module definition(AMD) oder CommonJS .Can auch Modul-Lader wie webpack

erkunden und anschauen können, um loszuwerden dieser Fehler geladen werden
1

Skripte, die Sie einschließen, werden in der Reihenfolge geladen, in der sie enthalten sind. Sie müssen daher angular.min.js einschließen, bevor Sie die Datei expression.js einschließen, da dies von der angular.min.js Datei abhängt.

<script src="/home/mohamed/Desktop/AngularJS/angular.min.js"></script> 
<script src="/home/mohamed/Desktop/AngularJS/expression.js"></script> 
Verwandte Themen