Javascript 声明控制器后出现错误：[$controller:ctrlreg]？_Javascript_Angularjs

Javascript 声明控制器后出现错误：[$controller:ctrlreg]？

javascript angularjs

Javascript 声明控制器后出现错误：[$controller:ctrlreg]？,javascript,angularjs,Javascript,Angularjs,我已经开始为我参加的angular js课程编写一些代码，我的控制台日志中出现了这个错误（错误：[$controller:ctrlreg]），我不知道为什么？我在angular的网站上查看过，它说你正在尝试呼叫一个不存在的控制器，或者类似的东西。我检查并声明了控制器，所以我不知道为什么会出现此错误。这是我的代码，请帮忙，谢谢 js： (function () { 'use strict'; angular.module('narrowDownMenuApp', [])

我已经开始为我参加的angular js课程编写一些代码，我的控制台日志中出现了这个错误（错误：[$controller:ctrlreg]），我不知道为什么？我在angular的网站上查看过，它说你正在尝试呼叫一个不存在的控制器，或者类似的东西。我检查并声明了控制器，所以我不知道为什么会出现此错误。这是我的代码，请帮忙，谢谢

js：

(function () {
      'use strict';

      angular.module('narrowDownMenuApp', [])
      .controller('narrowItDownController ', narrowItDownController )
      .service('MenuSearchService', MenuSearchService);

      narrowItDownController.$inject = ['MenuSearchService'];
      function narrowItDownController(MenuSearchService) {
        var menu = this;
        menu.input = "";
        menu.search = function() {
          console.log("blah");
          MenuSearchService.getMatchedMenuItems(searchTerm);
        }
      }
      MenuSearchService.$inject = ['$https'];
      function MenuSearchService($https) {
        var service = this;
        service.getMatchedMenuItems = function(searchTerm) {
          return $http({
            method: "GET",
            url: ('https://davids-restaurant.herokuapp.com/menu_items.json')
          }).then(function (result) {
              console.log(result);
            var foundItems

            // return processed items
            return foundItems;
          });
        }
      }
    })();

<!doctype html>
<html ng-app="narrowDownMenuApp">

<head>
    <title>Narrow Down Your Menu Choice</title>
    <meta charset="utf-8">
    <script src="angular.min.js"></script>
    <script src="app.js"></script>
</head>

<body>
    <div ng-controller='narrowItDownController as menu'>
        <h1>Narrow Down Your Chinese Menu Choice</h1>

        <div>
            <input type="text" placeholder="search term" ng-model="menu.input"> {{menu.input}}
        </div>
        <div>
            <button ng-click="menu.search()">Narrow It Down For Me!</button>
        </div>

        <!-- found-items should be implemented as a component -->
        <found-items found-items="...." on-remove="...."></found-items>
    </div>

</body>

</html>

html：

(function () {
      'use strict';

      angular.module('narrowDownMenuApp', [])
      .controller('narrowItDownController ', narrowItDownController )
      .service('MenuSearchService', MenuSearchService);

      narrowItDownController.$inject = ['MenuSearchService'];
      function narrowItDownController(MenuSearchService) {
        var menu = this;
        menu.input = "";
        menu.search = function() {
          console.log("blah");
          MenuSearchService.getMatchedMenuItems(searchTerm);
        }
      }
      MenuSearchService.$inject = ['$https'];
      function MenuSearchService($https) {
        var service = this;
        service.getMatchedMenuItems = function(searchTerm) {
          return $http({
            method: "GET",
            url: ('https://davids-restaurant.herokuapp.com/menu_items.json')
          }).then(function (result) {
              console.log(result);
            var foundItems

            // return processed items
            return foundItems;
          });
        }
      }
    })();

<!doctype html>
<html ng-app="narrowDownMenuApp">

<head>
    <title>Narrow Down Your Menu Choice</title>
    <meta charset="utf-8">
    <script src="angular.min.js"></script>
    <script src="app.js"></script>
</head>

<body>
    <div ng-controller='narrowItDownController as menu'>
        <h1>Narrow Down Your Chinese Menu Choice</h1>

        <div>
            <input type="text" placeholder="search term" ng-model="menu.input"> {{menu.input}}
        </div>
        <div>
            <button ng-click="menu.search()">Narrow It Down For Me!</button>
        </div>

        <!-- found-items should be implemented as a component -->
        <found-items found-items="...." on-remove="...."></found-items>
    </div>

</body>

</html>


缩小你的菜单选择范围
缩小你的中文菜单选择范围
{{menu.input}
为我缩小范围！

您有一个空间是您的控制器初始化

.controller('narrowItDownController', narrowItDownController )

您还必须在服务中注入

$http

 MenuSearchService.$inject = ['$http'];
 function MenuSearchService($http) {
     ....
 }

定义中的控制器名称中有空格。卸下它，你的控制器就会工作

 angular.module('narrowDownMenuApp', [])
      .controller('narrowItDownController', narrowItDownController )

.controller（'窄itdowncontroller'，窄itdowncontroller）

删除空间。你看到了吗？是的，谢谢你的帮助。无论谁投了反对票，请说明原因，以便我可以改进我的答案。谢谢，但即使在将$http注入我的服务后，我仍然会得到错误：[$injector:unpr]错误？你知道为什么吗？如果可以的话，请帮忙。PS：我不是投否决票的人。你是否删除了.controller中的空格（'RownitDownController'）？@Vivz我是投否决票的人。我承认这是一个错误。我只是把

$http

和

$https

混淆了，然后我把它删除了。@SankarRaj没问题。现在你已经给出了投否决票的原因，一切都好了