Error: "angular was used before it was defined", but online editors capable of outputting the result

I could not get the result from this code when I ran it on my local machine, but the strange part is the online editors that can give me the result: http://codepen.io/anon/pen/waXGom

* Im using the Adobe Brackets editor

Here is my HTML code:

    <!DOCTYPE html >
  <html>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.9/angular.min.js"></script>
    <script src= "app.js"></script>    
    <body ng-app="MyApp">

<div ng-controller="Controller2">
    <button ng-click="add()">Add Object</button>
    <button ng-click="reset()">Reset</button>
    <div remove="remove($index)" ng-repeat="name in names">
        {{name}}
    </div>
</div>

</body>
</html>

Here is my JS code:

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

    myApp.controller('Controller2', function ($scope) {
        $scope.names = [];
    var data = ['Dean', 'Andy', 'Dan', 'Wizek', 'Pete', 'Pawel', 'Chris', 'Misko'];
    $scope.add = function() {
        if (data.length)
            $scope.names.push(data.pop());
    };

        $scope.reset = function(index) {
        data.push($scope.names.splice(index, 1)[0]);
    };
    });

Please help me figure it out ...

+4
source share
3 answers

, , angular , JSLint? , angular, , JavaScript-, JSLint .

JSLint , . angular include, JSLint , , JavaScript .

, JSLint :

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

global, JSLint , .

/*global angular */
var myApp = angular.module('myApp', []);

.


, JSLinted JavaScript. . , if jslint white:true , . .

/*jslint white:true */
/*global angular */
var myApp = angular.module('myApp', []);
myApp.controller('Controller2', function ($scope) {
    "use strict";

    $scope.names = [];
    var data = ['Dean', 'Andy', 'Dan', 'Wizek', 'Pete', 'Pawel', 'Chris', 'Misko'];
    $scope.add = function() {
        if (data.length)
        {
            $scope.names.push(data.pop());
        }
    };

    $scope.reset = function(index) {
        data.push($scope.names.splice(index, 1)[0]);
    };
});
+20

...

/* global angular */

:

/ * global angular */
var myApp = angular.module('myApp', []);

, , JSLint , ( / ) .

+1

, . HTML

<body ng-app="MyApp">

angular.module('myApp', []);

<body ng-app="MyApp">

You get a console error because your page included AngularJS. It is not considered good practice to load scripts at the beginning or at the beginning of a page. You have to load all the scripts at the bottom of the page, or I can say in the footer.

0
source

All Articles