Question

我的ng-route代码有问题。浏览器中的地址正在变化，但在我的页面上，所有元素仍然相同。这是我的代码：

var app=angular.module('mainApp',['ngRoute']);
app.config('$routeProvider', function($routeProvider){
  $routeProvider
      .when('/',{
            templateUrl: 'home.html'
      })
      .when('/about', {
            templateUrl: 'about.html'
      })
      .when('/contact', {
            templateUrl: 'contact.html'
      })
      .otherwise({ 
			redirectTo: '/'
			});
});

app.controller('mainCtrl',function($scope){

    });

<div ng-controller="mainCtrl">
	<div>
		<nav>
			<ul>
				<li><a href="#/">Home</a></li>
				<li><a href="#/about">About us</a></li>
				<li><a href="#/contact">Contact</a></li>
			</ul>
			</nav>
	</div>
	  <br/>
	<div ng-view ></div>
</div>

我有三个带有简单段落的子网站（主页，关于和联系.html）。

你能帮助我吗？

Answer 1

请使用app.config( function ( $routeProvider )代替app.config('$routeProvider', function ( $routeProvider )

脚本：

var app=angular.module('myApp',[]);
app.config(function($routeProvider){
  $routeProvider
      .when('/',{
            templateUrl: 'home.html'
      })
      .when('/about', {
            templateUrl: 'about.html'
      })
      .when('/contact', {
            templateUrl: 'contact.html'
      })
      .otherwise({ 
            redirectTo: '/'
            });
});

app.controller('mainCtrl',function($scope){

    });

Demo Fiddle：https://jsfiddle.net/jLdce3vj/43/

Answer 2

在评论中，您提到Desktop/SS/index.html#/是您的主页。赛欧是你的问题。

除非您通过HTTP服务器提供页面，否则路由不起作用。不幸的是，在您的文件系统上静态查看HTML页面将无法正常工作。

如果您的系统上有Python，则可以非常轻松地测试它：打开命令提示符并切换到Desktop/SS/目录。然后运行python -m SimpleHTTPServer 8080并进入浏览器http://localhost:8080。它应该完美地工作

ng-Route不起作用

2 个答案: