AngularJS 1: $ инжектор: ошибка модулятора

Пожалуйста, помогите мне понять, в чем проблема.

HTML:

    <!doctype html>
    <html ng-app='ShoppingListCheckOff'>
      <head>

        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="styles/bootstrap.min.css">
        <script src="angular.min.js"></script>
        <script src="app.js"></script>
    </head>
    <body>
     <div class="col-md-6" ng-controller='ToBuyController' >
     </div>


     <div class="col-md-6" ng-controller='AlreadyBoughtController' >
    </div>

    </body>
    </html>

А вот и app.js

(function () {
'use strict';

angular.module('ShoppingListCheckOff', [])

.controller('ToBuyController', MyToBuyController);
.controller('AlreadyBoughtController', MyAlreadyBoughtController);
.service('ShoppingListCheckOffService', ShoppingListCheckOffService);

MyToBuyController.$inject = ['ShoppingListCheckOffService'];

function MyToBuyController($scope, $filter, $injector) {

    }
}


/////////////

MyAlreadyBoughtController.$inject = ['ShoppingListCheckOffService'];


}



function ShoppingListCheckOffService() {
}



})();

И ошибка: angular.min.js: 6 Неперехваченная ошибка: [$ injector: modulerr] http://errors.angularjs.org/1.5.7/ $ injector / modulerr? p0 = ShoppingListCheckOf…% 20% 20at% 20Bc% 20 (http% 3A% 2F% 2Flocalhost% 3A3000% 2Fangular.min.js% 3A21 % 3A163) (…)

Большое спасибо


person Miguel Mas    schedule 04.12.2016    source источник
comment
разместите свои контроллеры   -  person Sajeetharan    schedule 04.12.2016
comment
Используйте неминифицированную версию angular, и у вас будут более четкие сообщения об ошибках, которые вы затем сможете опубликовать здесь. Уменьшенная версия предназначена для производства, а не для разработки.   -  person JB Nizet    schedule 04.12.2016
comment
Тем не менее, MyToBuyController и MyAlreadyBoughtController не определены в app.js   -  person JB Nizet    schedule 04.12.2016
comment
Вы ошибаетесь JS вне зависимости от углового. Вы не можете закончить строку с помощью ;, а затем использовать .controller, как будто вы связываете методы.   -  person Ron Dadon    schedule 04.12.2016


Ответы (1)


Определите эти два контроллера в файле script.js.

Проверить демо

(function () {
'use strict';
var app= angular.module('ShoppingListCheckOff', [])
app.controller("ToBuyController", function($scope) {
  $scope.msg ="ToBuyController";
});
app.controller("AlreadyBoughtController", function($scope) {
   $scope.msg ="AlreadyBoughtController";
});


})();
<!DOCTYPE html>
<html>
<head>
<script data-require="[email protected]" data-semver="1.4.7" src="https://code.angularjs.org/1.4.7/angular.js"></script>
</head>
<body ng-app="ShoppingListCheckOff">
<div class="col-md-6" ng-controller='ToBuyController' >
  {{msg}}
</div>
<div class="col-md-6" ng-controller='AlreadyBoughtController' >
   {{msg}}
 </div>  
 </body>
</html>

person Sajeetharan    schedule 04.12.2016