如何在路由配置中为模板使用控制器？
如何在路由配置中为模板使用控制器？
提问于 2015-08-18 18:21:08
我对角度不熟悉，所以如果术语不太正确，请对我好一点。我试图建立一个简单的网站，其中目前包括3页与控制器不同的网页，在不同的文件。
我有路由设置，我想在联系人页面上使用一个控制器，但是我一直收到以下错误：
Argument 'js/controllers/contact/ContactController.js' is not a function, got undefined
我有一个app.js文件，如下所示：
angular.module('simpleApp', ['ngRoute'])
.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/home/index.html'
})
.when('/about', {
templateUrl: 'views/about/index.html'
})
.when('/contact', {
templateUrl: 'views/contact/index.html',
controller: 'js/controllers/contact/ContactController.js',
controllerAs: 'contactCtrl'
})
.otherwise({
redirectTo: '/'
});
}]);这是我在主index.html中的身体：
<body ng-app="simpleApp">
<header>
<div class="container">
<div class="row">
<div class="col-xs-6">
<a href="/#/" class="logo">SimpleApp</a>
</div>
<nav class="main-menu" ng-controller="NavController as navCtrl">
<ul class="list-unstyled list-inline">
<li>
<a href="/#/" class="main-menu__link" ng-class="{ 'main-menu__link--active': navCtrl.isActive('/')}">Home</a>
</li>
<li>
<a href="/#/about" class="main-menu__link" ng-class="{ 'main-menu__link--active': navCtrl.isActive('/about')}">about</a>
</li>
<li>
<a href="/#/contact" class="main-menu__link" ng-class="{ 'main-menu__link--active': navCtrl.isActive('/contact')}">Contact Us</a>
</li>
</ul>
</nav>
</div>
</div>
</header>
<main>
<div ng-view></div>
</main>
<footer>
footer
</footer>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script>
<script type="text/javascript" src="https://code.angularjs.org/1.4.4/angular-route.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript" src="js/controllers/shared/NavController.js"></script>
<script type="text/javascript" src="js/controllers/contact/ContactController.js"></script>
</body>我不知道该怎么做才能解决这个问题，或者我做错了什么。
真的很感谢你提前提供帮助
回答 4
Stack Overflow用户
回答已采纳
发布于 2015-08-18 18:23:12
在我看来，所有的事情都是正确的，但是试着改变路线上的控制器：
controller: 'js/controllers/contact/ContactController.js',对此：
controller: 'ContactController',Stack Overflow用户
发布于 2015-08-18 18:33:18
在路由文件中，在控制器部分，您不必提供js引用，只需输入控制器名称即可。
因为一旦应用程序初始化，角知道它的所有控制器名称。所以你不必在任何地方提供进一步的参考资料。始终提供与启动文件相关的引用。
Stack Overflow用户
发布于 2015-08-18 18:28:39
不使用控制器文件的路径。只需使用控制器的名称。就像您的控制器文件->js/控制器/ContactController.js一样
app.controller("ContactController", contactControllerFun);
contactControllerFun.$inject = ['$scope',....];
function contactControllerFun($scope, ....)
{
//your controller code.....
}意思不是控制器： 使用“控制器：'ContactController'”
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/32079921
复制相关文章
相似问题
腾讯云开发者
