我对AngularJS路由有问题：我没有得到任何页面反馈.没有错误或视图切换.
我检查了模块的实现,但它以正确的方式声明.然后我搜索了诸如templateURL之类的拼写错误,但我没有找到任何拼写错误.我也尝试在列表中使用ng-href而不是href,但是链接不再可以点击了.
我的代码：
>创建我的导航：
<body ng-app="Productportfolio">
<ul>
<li>
<a href="#/home">Home</a>
</li>
<li>
<a href='#/privat'>Log in</a>
</li>
</ul>
<ng-view></ng-view>
<!--own js -->
<script src="app.js"></script>
<!--Controller -->
<script src="ProductCtrl.js"></script>
<!--Services -->
<!--Direktives-->
</body>
>制作模板：
//home.html <div> <h1> Home </h1> </div> //private.html <div> <h1> Private</h1> </div>
>声明了一个Angular模块：
angular.module('Productportfolio',['ngRoute'])
>在我的配置中添加了$routeProvider：
angular.module('Productportfolio',['ngRoute','ProductService','ProductCtrl'])
.config(['$routeProvider,$locationProvider',function ($routeProvider,$locationProvider) {
$routeProvider
.when('/home',{
templateUrl: 'home.html',controller: 'ProductCtrl'
})
.when('/private',{
templateUrl: 'private.html',controller: 'ProductCtrl'
})
.otherwise({
redirectTo: '/home',controller: 'ProductCtrl'
});
$locationProvider.hashPrefix('!');
}]);
在您的Plunker中,存在一些与进口相关的问题.为了方便起见,我简单地删除了jQuery和Bootstrap.我还将所有模块放在一个app.js文件中.
你的html中有一些错误：
<!DOCTYPE html>
<html>
<head>
<Meta charset="utf-8" />
<title>AngularJS Plunker</title>
<!--AngularJS-->
<script data-require="angularjs@1.5.8" data-semver="1.5.8" src="https://opensource.keycdn.com/angularjs/1.5.8/angular.min.js"></script>
<script data-require="angular-route@1.5.8" data-semver="1.5.8" src="https://code.angularjs.org/1.5.8/angular-route.js"></script>
</head>
<body ng-app="Productportfolio">
<ul>
<li>
<a ng-href="#home">Home</a>
</li>
<li>
<a ng-href="#private">Private</a>
</li>
</ul>
<ng-view></ng-view>
<!--own js -->
<script src="app.js"></script>
</body>
</html>
>导入角度BEFORE ngRoute或任何其他模块
>使用ng-href =’#routeName’或,否则
在你的js：
var myApp = angular.module('Productportfolio',['ngRoute']);
myApp.controller('ProductCtrl',['$scope',function ($scope) {
var vm = this;
}]);
myApp.config(['$routeProvider',function ($routeProvider) {
$routeProvider
.when('/home',{
templateUrl: 'home.html',controller: 'ProductCtrl'
})
.when('/private',{
templateUrl: 'private.html',controller: 'ProductCtrl'
})
.otherwise({
redirectTo: '/home',controller: 'ProductCtrl'
});
}]);
>您只需在应用程序模块中注入外部模块,而不是所有控制器,服务等
请注意,为了方便起见,我还删除了您的服务,因为您没有共享它并且它很有用.
最后但并非最不重要的,如果你想使用$locationProvider.hashPrefix(‘！’);要使用hashbangs,您需要添加< base href =“/”/>在你的头脑中.
出于某种原因,plunker不允许我这样做,但我相信你会让它在你的版本上工作.
Here您可以找到复制您的应用程序的工作plunker.
希望我一直很有帮助.
