使用angular js導航到應用程序中的不同頁面

這個問題對於你們中的一些人聽起來很普通，但作爲一個新手我在這方面遇到了麻煩。顯然，在主頁中使用ng-view是爲了在頁面中顯示其他html文件，但我應該如何重定向到Web應用程序中存在的新頁面。我的意思是如何在多頁面Web應用程序中路由到完全不同的網頁。使用angular js導航到應用程序中的不同頁面

來源

2017-03-05 jayendra bhatt

進口AngularJs-路由文件

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

然後，你必須添加ngRoute作爲應用模塊中的依賴性：

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

使用$routeProvider配置在不同的路線您的應用：

app.config(function($routeProvider) { 
$routeProvider 
    .when("/", { 
    templateUrl : "main.htm" 
    }) 
    .when("/red", { 
    templateUrl : "red.htm" 
    }) 
    .when("/green", { 
    templateUrl : "green.htm" 
    }) 
    .when("/blue", { 
    templateUrl : "blue.htm" 
    }); 
});

結構中的HTML

<body ng-app="myApp"> 

<p><a href="#/">Home</a></p> 
<a href="#red">Red</a> 
<a href="#green">Green</a> 
<a href="#blue">Blue</a> 

<div ng-view></div> 
</body>

對於嵌套的觀點，你可以使用https://github.com/angular-ui/ui-router

關注https://github.com/angular-ui/ui-router/wiki/Nested-States-&-Nested-Views參考

來源

2017-03-05 07:16:25

我想要頁面重定向到另一個頁面，而不是在ng-view中包含html，當我點擊超鏈接時，紅色綠色或藍色 –

@jayendrabhatt你的意思是不同的域名？ –

不，我的意思是在「green.htm」中，我可以在green.htm中編寫ng-view，而不是在包含超鏈接的html模板文件中編寫。 –