Question

我收到此错误 - 错误：$ controller：ctrlreg未注册具有此名称的控制器。我的所有脚本都已加载，我将它们全部添加到index.html中。

我的控制器：

 (function() {
    angular.module("nsoftModule").controller("nsoftController", ["nsoftService", function(nsoftService) {
        var self = this;
        self.service = nsoftService;
    }])
})();

我的指示：

 (function() {
    var weatherMod = angular.module("nsoftModule", []);
    weatherMod.directive("nsoftDirective", function() {
        return {
            templateUrl: "Template/weatherTemplate.html",
            controller: "nsoftController as nsoftCtrl"
        }
    });
 })();

我的服务：

 (function() {
    var weatherMod = angular.module("nsoftModule", []);
    weatherMod.service("nsoftService", ["http", function(http) {
        var service = this;
    }]);
})();

我的模块：

(function() {
    var weatherMod = angular.module("nsoftModule", []);
})();

我的模板：

<div class="container">
   <div ng-controller="nsoftController">
      <p>Name : <input type="text" ng-model="name"></p>
      <h1>Hello {{name}}</h1>
   </div>
</div>

我的app.js：

(function() {
    angular.module("nsoftApp", ["nsoftModule"]);
})();

我的index.html：

<!DOCTYPE html>
<html ng-app="nsoftApp">
   <head>
      <title>Nsoft App</title>
   </head>
   <body>
      <nsoft-directive></nsoft-directive>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script>
      <script src="weatherModule.js"></script>
      <script src="Service/weatherService.js"></script>
      <script src="Controller/weatherController.js"></script>
      <script src="Directive/weatherDirective.js"></script>
      <script src="app.js"></script>
   </body>
</html>

Answer 1

只需删除全局变量，因为在使用匿名自调用函数变量时，仅限于一个匿名函数。像他一样使用

(function() {
    angular.module("nsoftModule").controller("nsoftController", ["nsoftService", function(nsoftService) {
        var self = this;
        self.service = nsoftService;
    }])
})();

(function() {
    angular.module("nsoftModule").directive("nsoftDirective", function() {
        return {
            templateUrl: "Template/weatherTemplate.html",
            controller: "nsoftController as nsoftCtrl"
        }
    });
})();

//change http to $http 
(function() {
    angular.module("nsoftModule").service("nsoftService", ["$http", function($http) {
        var service = this;
    }]);
})();

(function() {
    angular.module("nsoftModule", []);
})();

因为控制器从指令分配不需要在html中声明它

<div class="container">
<div >
   <p>Name : <input type="text" ng-model="nsoftCtrl.name"></p>
   <h1>Hello {{nsoftCtrl.name}}</h1>
</div>

(function() {
    angular.module("nsoftApp", ["nsoftModule"]);
})();

Angular控制器未在XAMPP Web服务上注册

1 个答案: