2015-09-29 2 views
1

Я написал простую программу в AngularJS после включения миниатюрного углового JS в теге скрипта, но браузер не может разобрать угловой код JS. У меня есть другие программы с более или менее одинаковым кодом, и они работают нормально.Браузер не смог разобрать код AngularJS

Я пропустил/пропустил что-нибудь?

MVC Пример

<!DOCTYPE html> 
<html ng-app> 
    <head> 
     <title>MVC Example</title> 
     <script src="js/angular.min.js"></script> 
     <script> 
      function MyFirstCtrl($scope) { 
       var employees = ['Catherine Grant', 'Monica Grant', 'Christopher Grant', 'Jennifer Grant']; 
       $scope.ourEmployees = employees; 
      } 
     </script> 
    </head> 
     <body ng-controller='MyFirstCtrl'> 
     <h2>Number of Employees: {{ourEmployees.length}}</h2> 
    </body> 
</html> 

Browser Выход:

Number of Employees: {{ourEmployees.length}} 
+2

глобальные функции больше не поддерживается - См http://stackoverflow.com/questions/25111831/controller-not-a-function-got-undefined-while-defining-controllers- глобально – charlietfl

ответ

4

Вам необходимо создать модуль для использования с ng-app.

angular.module("foo", []); 
angular.controller("MyFirstCtrl", MyFirstCtrl); 

<html ng-app=foo> 
+0

@ Кавычки от Asok не нужны –

+0

Должен ли код, указанный выше, быть в '{{angular.module (" foo ", []) ........}}' – user2325154

+0

@ user2325154 первые две строки находятся в вашем JavaScript-коде или '

0

Вам нужно запустить приложение и добавить контроллер в нужной форме:

<script> 
var app = angular.module("app", []); 
app.controller('MyFirstCtrl', ['$scope', function ($scope) { 
    var employees = ['Catherine Grant', 'Monica Grant', 'Christopher Grant', 'Jennifer Grant']; 
    $scope.ourEmployees = employees; 
}]); 
<script> 
+0

Я использую Angular JS version 1.2 – user2325154

0

После некоторого R & DI, наконец, выяснили решение как для v1.2 и v1.3 +

v1.2

<!DOCTYPE html> 
<html ng-app=foo> 
    <head> 
     <title>MVC Example</title> 
     <script src="js/angular.min-1.2.js"></script> 
     <script> 
      angular.module("foo", []); 
      angular.controller("MyFirstCtrl", MyFirstCtrl); 

      var employees = ['Catherine Grant', 'Monica Grant', 'Christopher Grant', 'Jennifer Grant']; 

      function MyFirstCtrl($scope) { 
       var employees = ['Catherine Grant', 'Monica Grant', 'Christopher Grant', 'Jennifer Grant']; 
       $scope.ourEmployees = employees; 
      } 
     </script> 
    </head> 
     <body ng-controller='MyFirstCtrl'> 
     <h2>Number of Employees: {{ourEmployees.length}}</h2> 
    </body> 
</html> 

v1.3 + Onwards

<!DOCTYPE html> 
<html ng-app=foo> 
    <head> 
     <title>MVC Example</title> 
     <script src="js/angular.min-1.4.js"></script> 
     <script> 
      var employees = ['Catherine Grant', 'Monica Grant', 'Christopher Grant', 'Jennifer Grant']; 
      var foo = angular.module("foo", []); 
      foo.controller("MyFirstCtrl", function ($scope) { 
       $scope.ourEmployees = employees; 
      }); 
     </script> 
    </head> 
     <body ng-controller='MyFirstCtrl'> 
     <h2>Number of Employees: {{ourEmployees.length}}</h2> 
    </body> 
</html>