javascript - ASP.NET MVC 应用程序中的 Angular 路由

Question

我有一个链接如下:

<a href="#/Home">view</a>

还有一个将加载 Home.html 的 div，如下所示:

<div class="col-md-8">
    <ng-view></ng-view>
</div>

我的 Angular 配置是:

myApp = angular.module("myApp", ["ngRoute"])
    .config(function ($routeProvider) {
        $routeProvider
        .when("/Home", {
            templateUrl: "Templates/Home.html",
            controller: "HomeController"
        })
    })
    .controller("BlogController", function ($scope, $http) {
        $http.get("/Home/GetBlogEntries")
            .then(function (response) {
                $scope.data = response.data;
            });
        $scope.removeBlogEntry = function (index) {
            $scope.data.Data.splice(index, 1);
        };
    })
    .controller("HomeController", function ($scope, $http) {

    });

在我单击链接之前，URL 显示为 http://localhost:58679/#/Home，单击它后，地址栏将显示为 http://localhost :58679/#!#%2FHome

基本上没有任何反应，我的 home.html 没有在应该的位置渲染。

Answer 1

在您的配置中包含 $locationProvider.hashPrefix('');。

myApp = angular.module("myApp", ["ngRoute"])
.config(function ($routeProvider,$locationProvider) {
        $locationProvider.hashPrefix('');
        $routeProvider
        .when("/Home", {
            templateUrl: "Templates/Home.html",
            controller: "HomeController"
   })
})