角度路線無法正常工作。第一頁顯示其他頁面不切換視圖

-1

angularjs路徑無法正常工作。第一頁顯示其他頁面不切換視圖。這裏是代碼角度路線無法正常工作。第一頁顯示其他頁面不切換視圖

的script.js

var app = angular.module("myApp", ["ngRoute"]); 

app.config(function($routeProvider) { 
    $routeProvider 
    .when("/", { 
    templateUrl: "home.html", 
    }) 
    .when("/About", { 
    templateUrl: "About.html", 
    }) 
    .when("/contact", { 
    templateUrl: "contact.html", 
    }); 
});

的index.html

<!DOCTYPE HTML> 
<html> 

<head> 
    <title>Welcome Home</title> 
</head> 

<body ng-app="myApp"> 
    <p><a href="#">Main</a></p> 
    <a href="#About">About</a> 
    <a href="#contact">contact</a> 

    <h3> welcome to the page</h3> 

    <div ng-view></div> 

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-route.js"></script> 
    <script src="script.js"></script> 
</body> 

</html>

home.html的

<h1>Welcome Home </h1>

About.html

<h1>Welcome About </h1>

contact.html

<h1>Welcome Contact </h1>

來源

2017-07-15 Swapnali Toradmal

控制檯上是否有bug？ –

add $ locationProvider.html5Mode（true）;並且不要使用href =「＃about」，請將＃從href中刪除。 –

只需添加＃！在href之前它會像「About」 – Arun

另外要小心依賴注入。

app.config(['$routeProvider', function($routeProvider) { 
    $routeProvider 
    .when("/", { 
    templateUrl: "home.html", 
    }) 
    .when("/About", { 
    templateUrl: "About.html", 
    }) 
    .when("/contact", { 
    templateUrl: "contact.html", 
    }); 
    $locationProvider.html5Mode(true); 
}]);

來源

2017-07-15 08:30:59

角度路線無法正常工作。第一頁顯示其他頁面不切換視圖

回答

相關問題