2016-04-01 3 views
1

Я очень изучаю новичок Угловой js. Я следую видеоурокам и сделал следующий пример. Это не показывает выход. может annyone, дайте мне знать, что мне не хватает.ngcontroller не отображает данные на html Page

<!DOCTYPE html> 
<html > 
<head> 
    <title>Directives with Databinding</title> 
    <meta charset="utf-8" /> 
    <script src="scripts/angular.min.js"></script> 
</head> 
<body ng-app="ngcontrollereg"> 
    <div ng-controller="SimpleController"> 
     Name: <input type="text" ng-model="name" /> 
     <br /> 
     <ol> 
      <li ng-repeat="cust in customers | filter:name | orderBy:'city'">{{ cust.name | uppercase}}-{{cust.city}}</li> 
     </ol> 
    </div> 

    <script> 
     function SimpleController($scope) { 
      $scope.customers = [ 
       { name: 'John Does', city: 'Phoenix' }, 
       { name: 'Lake Oswere', city: 'Phoenix' }, 
       { name: 'Raman', city: 'Kanchira' }, 
       { name: 'Alvaro', city: 'Kanchira' } 
      ]; 
     } 
    </script> 
</body> 
</html> 

ответ

1

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

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="ngcontrollereg"> 
 
    <div ng-controller="SimpleController"> 
 
    Name: 
 
    <input type="text" ng-model="name" /> 
 
    <br /> 
 
    <ol> 
 
     <li ng-repeat="cust in customers | filter:name | orderBy:'city'">{{ cust.name | uppercase}}-{{cust.city}}</li> 
 
    </ol> 
 
    </div> 
 

 
    <script> 
 
    var app = angular.module('ngcontrollereg', []); 
 
    app.controller('SimpleController', function($scope) { 
 
     $scope.customers = [{ 
 
     name: 'John Does', 
 
     city: 'Phoenix' 
 
     }, { 
 
     name: 'Lake Oswere', 
 
     city: 'Phoenix' 
 
     }, { 
 
     name: 'Raman', 
 
     city: 'Kanchira' 
 
     }, { 
 
     name: 'Alvaro', 
 
     city: 'Kanchira' 
 
     }]; 
 
    }); 
 
    </script> 
 
</body>

+0

ооо Это не было вызвано моими учебниками. Большое спасибо за помощь. Нужно ли регистрировать модуль для контроллера? – Programmerzzz

+0

Да, это способ угловой привязки имени контроллера (т. Е. «SimpleController») к коду контроллера. Когда вы используете «SimpleController» в атрибуте html ng-controller, угловой поиск ищет контроллер, который был зарегистрирован с тем же именем. Имя функции не имеет к этому никакого отношения, на самом деле вы можете использовать анонимную функцию, как я. – fikkatra

+0

'$ scope' используется для привязки контроллера для просмотра вправо? так, как отличается от этого регистрация модуля? – Programmerzzz

1

Или вы можете создать его так:

angular.module('ngcontrollereg',[]).controller('SimpleController' ,function_Controller) 

    function function_Controller($scope) { 
     $scope.customers = [ 
      { name: 'John Does', city: 'Phoenix' }, 
      { name: 'Lake Oswere', city: 'Phoenix' }, 
      { name: 'Raman', city: 'Kanchira' }, 
      { name: 'Alvaro', city: 'Kanchira' } 
     ]; 
    } 
Смежные вопросы