Question

您好我的代码有问题。当我点击链接页面时，不会重新加载。

这是一个HTML和JS代码：

var app=angular.module('mainApp',['ngRoute']);
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){
	
});

<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>

你知道出了什么问题吗？

Answer 1

试试这个

var app=angular.module('mainApp',['ngRoute']);
    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){

    });

Answer 2

删除第二个和第二个分号（;）

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

Answer 3

打开控制台。可能你的BASE标签丢失了。将其添加到HEAD标记。

<base href="/" />

使用TemplateUrl不起作用

3 个答案: