Получение углового примера для запуска

Я изучаю angularJS, и мне не удается получить следующий пример кода из обучающего видео для запуска. Может ли кто-нибудь сказать мне, где я ошибся?Получение углового примера для запуска

Он прекратил работу, когда я изменил его из второй версии, показанной ниже. Вторая версия работает нормально, но когда я пытаюсь модулировать контроллер, он ломается.

<html ng-app="demoApp"> 
    <head> 
     <title>Hello World, AngularJS</title> 
    </head> 
    <body> 
     <div ng-controller="SimpleController"> 
      <br/> 
      <input type="text" ng-model="name"/> 
      <br/> 
      <ul> 
       <li ng-repeat="cust in customers | filter:name | orderBy:salary"> 
        {{ cust.name | uppercase}} - 
        {{ cust.city | lowercase }} - 
        {{ cust.salary | currency }} 
       </li> 
      </ul> 
     </div> 
     <script> 
     var demoApp = angular.module('demoApp',[]); 

     demoApp.controller('SimpleController', ['', function($scope){ 
      $scope.customers = [ 
       {name: 'John Smith',  city: 'Phoenix',  salary: 90000, hired: '2014-04-04'}, 
       {name: 'Jenny Linn',  city: 'New York', salary: 94000, hired: '2014-04-04'}, 
       {name: 'Johnson Holmes', city: 'Los Angeles', salary: 96000, hired: '2014-04-04'}, 
       {name: 'Thomas Muffin', city: 'Chicago',  salary: 80000, hired: '2014-04-17'} 
      ]}]) 
     </script> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script> 
    </body> 
</html>

версии, которая работает:

<html ng-app=""> 
    <head> 
    <title></title> 
    </head> 
    <body> 
    <div ng-controller="SimpleController"> 
     <input type="text" ng-model="nameInput" /> <span style="font-weight:bold"> {{ nameInput }}</span> 
     <h3>Listing1</h3> 
     <ul> 
     <li ng-repeat="cust in customers | filter: nameInput | orderBy: 'city' "> 
      {{ cust.name | uppercase }} - {{ cust.city }} - {{ cust.salary }} - {{ cust.hired | date:'yyyy-MM-dd' }} 
     </li> 
     </ul> 
    </div> 
    <script> 
    function SimpleController($scope) { 
    $scope.customers = [ 
     {name: 'John Smith',  city: 'Phoenix',  salary: 90000, hired: '2014-04-04'}, 
     {name: 'Jenny Linn',  city: 'New York',  salary: 94000, hired: '2014-04-04'}, 
     {name: 'Johnson Holmes', city: 'Los Angeles', salary: 96000, hired: '2014-04-04'}, 
     {name: 'Thomas Muffin', city: 'Chicago',  salary: 80000, hired: '2014-04-17'} 
    ]; } 
    </script> 


    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script> 
    </body> 
</html>

источник

2014-08-20 EdgeCase

Две проблем здесь.

Во-первых, вам необходимо ввести строковый литерал '$scope' в ваш контроллер.

Ваши файлы углового скрипта должны быть отображены перед вашими другими файлами, связанными с угловым выражением. i.e поставить ваш <script src = 'google api here'> перед всеми вашими другими тегами javascript.

<html ng-app="demoApp"> 
<head> 
<title>Hello World, AngularJS</title> 
</head> 
<body> 
<div ng-controller="SimpleController"> 
    <br/> 
    <input type="text" ng-model="name"/> 
    <br/> 
    <ul> 
     <li ng-repeat="cust in customers | filter:name | orderBy:salary"> 
      {{ cust.name | uppercase}} - 
      {{ cust.city | lowercase }} - 
      {{ cust.salary | currency }} 
     </li> 
    </ul> 
    </div> 
    <!-- load your angular core script files first --> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script> 
    <script> 
     var demoApp = angular.module('demoApp',[]); 

     demoApp.controller('SimpleController', ['$scope', function($scope){ 
     $scope.customers = [ 
     {name: 'John Smith',  city: 'Phoenix',  salary: 90000, hired: '2014-04-04'}, 
     {name: 'Jenny Linn',  city: 'New York', salary: 94000, hired: '2014-04-04'}, 
     {name: 'Johnson Holmes', city: 'Los Angeles', salary: 96000, hired: '2014-04-04'}, 
     {name: 'Thomas Muffin', city: 'Chicago',  salary: 80000, hired: '2014-04-17'} 
    ]}]) 
    </script> 
</body> 
</html>

Вот working plnkr.

источник

2014-08-21 02:23:04 CozyAzure

Вам необходимо пройти $ объема в контроллер в модульном примере

demoApp.controller('SimpleController', ['$scope', function($scope){ 
     $scope.customers = [ 
      {name: 'John Smith',  city: 'Phoenix',  salary: 90000, hired: '2014-04-04'}, 
      {name: 'Jenny Linn',  city: 'New York', salary: 94000, hired: '2014-04-04'}, 
      {name: 'Johnson Holmes', city: 'Los Angeles', salary: 96000, hired: '2014-04-04'}, 
      {name: 'Thomas Muffin', city: 'Chicago',  salary: 80000, hired: '2014-04-17'} 
     ]}])

источник

2014-08-20 20:15:54 msarchet

Цените его. Я сделал это изменение, но это, похоже, не исправляет его :( – EdgeCase

Получение углового примера для запуска

ответ

Смежные вопросы