HTML-нг-контроллер против app.controller () форматы несовместимы

Question

HTML-нг-контроллер против app.controller () форматы несовместимы

0

Я пытаюсь определить контроллеры в HTML и js, используя очень простой пример. Контроллер Кена работает. Барби не делает. почему это?

http://jsfiddle.net/laurencefass/b18w58kc/1/

 <div ng-app='demo'>
  <p ng-controller='MyCtrl'>Hi, it Ken. The current time is {{ken_time}}</p>
  <p>Hi, it Barbie. The current time is {{barbie_time}}</p>

угловой код

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

function MyCtrl ($scope) {
    $scope.ken_time = new Date().toTimeString();
}

app.controller('BarbieCtrl', function($scope) {
    $scope.barbie_time = new Date().toTimeString();
});

Laurence Fass 29 окт. 2015, в 11:44

Источник

Теги:

angularjs

4 ответа

3

Вы определили demo и использовали его в качестве app.

var demo = angular.module('demo', []);
    ^^^  -->//defined

Используемый:

app.controller('BarbieCtrl', function($scope) {
^^^ --> //app is undefined

Примечание: ng-controller требуется при подключении контроллера.

Рабочий ДЕМО

Полный фрагмент:

<div ng-app='demo'>
    <p ng-controller='MyCtrl'>Hi, it Ken. The current time is {{ken_time}}</p>
    <p ng-controller='BarbieCtrl'>Hi, it Barbie. The current time is {{barbie_time}}</p>
</div>

Manwal 29 окт. 2015, в 09:04

1

Это самый полный ответ. Принесено вам правками ниндзя, но отсюда и самый полный ответ;)
SeToY 29 окт. 2015, в 10:25

1

Попробуем объяснить, что здесь не работает.

В вашем html вы определили приложение как демонстрацию и контроллер, который вы используете для barbie_time, связан с приложением. и нет модуля приложения.
Также MyCtrl является независимым контроллером, который не связан ни с одним модулем. Не с демо.

Чтобы заставить его работать, вам необходимо связать контроллер с demo модулем и подключить контроллер, используя директиву ng-controller как показано ниже.

      <div ng-app='demo'>
      <p ng-controller='MyCtrl'>Hi, it Ken. The current time is  {{ken_time}}</p>
      <p ng-controller="BarbieCtrl">Hi, it Barbie. The current time is {{barbie_time}}</p>


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

      function MyCtrl ($scope) {
        $scope.ken_time = new Date().toTimeString();
      }

      demo.controller('BarbieCtrl', function($scope) {
        $scope.barbie_time = new Date().toTimeString();
      });

Посмотрите на свою рабочую скрипту: http://jsfiddle.net/b18w58kc/5/ Новичка путают со словом app потому что это очень часто для определения модуля в угловом. app является ключевым словом в AngularJS, чтобы работать как модуль, вы должны определить его для работы как модуль. Надеюсь, это поможет вам.

Anand Ghaywankar 29 окт. 2015, в 09:11

1

Вы app.controller доступ к app.controller, а не demo.controller.

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

function MyCtrl ($scope) {
    $scope.ken_time = new Date().toTimeString();
}

demo.controller('BarbieCtrl', function($scope) {
    $scope.barbie_time = new Date().toTimeString();
});

Кроме того, вам нужно будет определить контроллер для вашего Barbie Time:

<p ng-controller='BarbieCtrl'>Hi, it Barbie. The current time is {{barbie_time}}</p>

SeToY 29 окт. 2015, в 07:45

Ещё вопросы

Это самый полный ответ. Принесено вам правками ниндзя, но отсюда и самый полный ответ;)

Molske · Accepted Answer · 2015-10-29T09-09-00.000Z

Вы забыли ng-controller='BarbieCtrl' контроллер: добавьте ng-controller='BarbieCtrl'

<div ng-app='demo'>
  <p ng-controller='MyCtrl'>Hi, it Ken. The current time is {{ken_time}}</p>
  <p ng-controller='BarbieCtrl'>Hi, it Barbie. The current time is {{barbie_time}}</p>
</div>

Кроме того, вам нужно добавить контроллер в demo.controller приложение: demo.controller вместо app.controller

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

function MyCtrl ($scope) {
    $scope.ken_time = new Date().toTimeString();
}

demo.controller('BarbieCtrl', function($scope) {
    $scope.barbie_time = new Date().toTimeString();
});