Question

由于某些原因，当我单击链接时，routeProvider在我的代码中不起作用。我似乎找不到错误。

var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
  $routeProvider
    .when("/", {
      template: "Order Details"
    })
    .when("/first", {
      templateUrl: "first.html"
    })
    .when("/second", {
      templateUrl: "second.html"
    })
    .when("/third", {
      templateUrl: "third.html"
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<a href="#/first">show details</a>
<a href="#/second">show details</a>
<a href="#/third">show details</a>
<div ng-view></div>

Answer 1

这是您的解决方法：将 href =“＃/ first ”更改为 href =“＃！first” 并将以下几行添加到您的角度应用程序配置中：

.config(function ($locationProvider) {
    $locationProvider.hashPrefix('!');
}

这是相同的工作工具：Click Here

由于我们正在定义templateUrl参数，我们向该参数提供要加载的模板的路径，因此会产生差异。如果我们使用模板参数来提供直接的html代码来加载，那么您的代码将完美运行。

AngularJS $ routeProvider：路由不起作用

1 个答案: