这是我的第一个 AngularJs 应用程序,并在浏览了网络上的许多示例后创建了它,但我在这里做错了。很有可能是因为文件存储在专用文件夹中。该HomeView.html
模板被载入罚款,但控制器没有。我的意思是我无法greetingMessage
在模板中打印。我看到的只是{{ greetingMessage }}
“欢迎!”。我错过了什么?
错误
Error: [$controller:ctrlreg] http://errors.angularjs.org/1.6.4/$controller/ctrlreg?p0=HomeController
应用程序结构
app
conponents
home
HomeView.html
HomeController.js
...
...
index.js
index.html
索引.html
<body ng-app="myApp">
<h3>AngularJS</h3>
<hr />
<p><a href="#!">Home</a></p>
<div ng-view></div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-route.min.js"></script>
<script src="index.js"></script>
</body>
索引.js
var module = angular.module('myApp', ['ngRoute']);
module.config(function($routeProvider) {
$routeProvider
.when('/', {
templateUrl : 'components/home/HomeView.html',
controller: 'HomeController'
// I tried -> controller: 'components/home/HomeController'
})
.otherwise({
redirectTo: '/'
});
});
主页视图.html
<div ng-controller="HomeController">
<h4>Home</h4>
<p>{{ greetingMessage }}</p>
</div>
主控制器.js
var module = angular.module('myApp', []);
module.controller('HomeController', [
'$scope',
function(
$scope
) {
$scope.greetingMessage = 'Welcome!';
}]);
最主要的原因是你没有提到homeController.js
的index.html
,应该经过正确的地方index.js
。这不会解决您的问题。我想提到的另一件事是,myApp
在将控制器注册到模块时不应再次创建myApp
模块。通过声明 newmodule
将清除以前注册的组件。因此,只需使用模块 getterangular.module('myApp')
并为其附加更多组件。
<script src="components/home/HomeController.js">
代码
angular.module('myApp')
.controller('HomeController', [ '$scope',
function($scope) {
$scope.greetingMessage = 'Welcome!';
}
]);
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句