Angular模板路由无法工作且无报错，新手求助解决方案

作为刚接触AngularJS路由的新手，遇到这种配置完没反应也没报错的情况真的很挠头，咱们一步步来排查这些最容易踩的坑：

1. 确认ngRoute依赖是否正确引入 #

首先得确保你已经在页面里加载了angular-route.js文件，而且加载顺序必须在angular.js之后，比如：

<script src="angular.js"></script>
<script src="angular-route.js"></script>

如果用CDN的话，一定要注意版本匹配——别一个用1.8.x，另一个用1.6.x，版本不兼容经常会导致路由悄悄失效。

2. 检查模板路径是否正确 #

你代码里写了../borrower.html和administrator.html，这里的相对路径很容易出错：

• 路由的模板路径是相对于当前主HTML页面的位置，而不是你的JS文件位置！比如如果主页面在/app/index.html，JS在/app/js/app.js，那../borrower.html会指向/borrower.html，如果你的borrower.html实际在/app/borrower.html，那应该写成borrower.html或者./borrower.html。
• 可以先改成绝对路径试试（比如/app/borrower.html），如果能正常加载，就说明是相对路径的问题。

3. 主页面是否有<ng-view>挂载点 #

这是新手最容易忘的点！AngularJS路由需要一个指定的标签来渲染模板，你必须在主页面（比如administrator.html）里加上：

<ng-view></ng-view>

所有路由对应的模板都会渲染到这个标签里，没加的话就算路由配置全对，也看不到任何效果。

4. 路由跳转方式是否符合Angular规范 #

别用普通的<a href="/borrower">跳转，要改成AngularJS专属的路由跳转方式：

<a href="#!/borrower">跳转到借款人页面</a>

或者更严谨的ng-href：

<a ng-href="#!/borrower">跳转到借款人页面</a>

注意开头的#!/——AngularJS默认用hashbang模式，不加的话路由根本识别不到你的跳转请求。

5. 检查路由配置的语法完整性 #

你贴的代码里.when("/book", ...后面没写完，要确保整个$routeProvider的配置是完整闭合的，比如：

var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
  $routeProvider
    .when("/borrower", {
      templateUrl : "../borrower.html"
    })
    .when("/", {
      templateUrl : "administrator.html"
    })
    .when("/book", {
      templateUrl : "../book.html" // 补全你的book页面配置
    })
    .otherwise({ // 最好加一个默认路由，防止输入错误路径时无响应
      redirectTo : "/"
    });
});

如果有语法错误（比如少了括号、逗号），有时候浏览器控制台不会直接报错，但整个路由配置会静默失效。

6. 开启调试模式查看隐藏日志 #

可以在模块配置里开启Angular的调试模式，这样能在控制台看到更多路由相关的细节：

app.config(function($routeProvider, $compileProvider) {
  $compileProvider.debugInfoEnabled(true); // 开启调试信息
  // 你的路由配置代码...
});

然后打开浏览器开发者工具（F12）的Console标签，看看有没有隐藏的警告或者错误——有时候看似没报错，其实是被浏览器忽略了。

先从这几个点排查，大部分新手的路由问题都是这些原因导致的，一步步试下来应该能解决～

内容的提问来源于stack exchange，提问作者CD6554