在webapi應用程序中使用角度路由

我不知道如何在web api應用程序中實現適當的角度路由。我可以使用這種方法打開頁面：http://localhost:52876/HTML/app/borrower.html 在webapi應用程序中使用角度路由

角度控制器加載良好，所有功能都從角度方向出現。

現在，我希望能夠使用ng-route在更好的視圖中打開視圖，因此例如http://localhost:52876/HTML/app/borrower.html將變爲 http://localhost:52876/borrower。

我在我使用的角度應用程序中使用的html文件中包含了ng-route.js文件。

此外，在app.js我有這樣的：

'use strict'; 

var modules = [ 
    'app.controllers', 
    'LoanAdminApplicationController', 
    'ngCookies', 
    'ngResource', 
    'ngSanitize', 
    'ngRoute', 
    'ui.router', 
    'LocalStorageModule', 
    'angular-loading-bar' 
]; 

var app = angular.module('app', modules); 


app.config(function ($routeProvider, $locationProvider) { 
    $locationProvider.html5Mode(true); 
    $routeProvider.when("/home", { 
     controller: "homeController", 
     templateUrl: "/app/views/home.html" 
    }); 

    $routeProvider.when("/login", { 
     controller: "loginController", 
     templateUrl: "/HTML/login.html" 
    }); 

    $routeProvider.when("/signup", { 
     controller: "signupController", 
     templateUrl: "/app/views/signup.html" 
    }); 

    $routeProvider.when("/register", { 
     controller: "signupController", 
     templateUrl: "/app/views/register.html" 
    }); 

    $routeProvider.when("/refresh", { 
     controller: "refreshController", 
     templateUrl: "/app/views/refresh.html" 
    }); 

    $routeProvider.when("/tokens", { 
     controller: "tokensManagerController", 
     templateUrl: "/app/views/tokens.html" 
    }); 

    $routeProvider.when("/borrower", { 
     controller: "borrowerController", 
     templateUrl: "/HTML/app/borrower.html" 
    }); 

    $routeProvider.otherwise({ redirectTo: "/home" }); 

});

的HTML標記（我刪除內容）：

<!DOCTYPE html> 
<html ng-app="app"> 
<head> 
</head> 
<body ng-controller="BorrowerQuickQuoteApplication"> 


    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
    <script src="/assets/js/jquery.min.js"></script> 
    <script src="/assets/js/modernizr.js"></script> 
    <!-- Include all compiled plugins (below), or include individual files as needed --> 

    <script src="/assets/js/bootstrap.min.js"></script> 
    <script src="/Scripts/angular.js"></script> 
    <script src="/Scripts/angular-cookies.min.js"></script> 
    <script src="/Scripts/angular-resource.min.js"></script> 
    <script src="/Scripts/angular-sanitize.min.js"></script> 
    <script src="/Scripts/angular-route.min.js"></script> 
    <script src="/Scripts/angular-ui-router.min.js"></script> 
<script src="/Angular/controllers.js"></script> 
    <script src="/Angular/LoanApplicationController.js"></script> 
    <script src="/Angular/services.js"></script> 
    <script src="/Scripts/angular-local-storage.min.js"></script> 
<script src="/Scripts/loading-bar.min.js"></script> 

<script src="/Angular/app.js"></script> 
</body> 
</html>

任何想法，我需要什麼，以使這個工作做？

我應該修改RouteConfig.cs文件還是我還需要做其他任何事情？

感謝，Laziale

來源

2016-08-05 Laziale

你的應用程序在路由中出現什麼錯誤？ – Developer

沒有錯誤顯示，我可以共享teamviewer如果你想 – Laziale

我認爲你點擊菜單，但它不是正確的路線 – Developer

因爲你正在做的是角航線的工作，例如

$routeProvider.when("/borrower", { 
     controller: "borrowerController", 
     templateUrl: "/HTML/app/borrower.html" 
    });

當你去localhost:8080/yourapp/borrower

，你做你不與文件名瀏覽需要ng-view在您的index.html

像這樣

<div ng-view></div>

您的網頁將顯示在此處。

路由器會看你所要求的，借款人，它會帶你到/HTML/app/borrower.html 您正在使用的HTML 5種模式意味着你需要服務器端的路由，因此它可以落在每一次的index.html所以你url可以沒有散列。

來源

2016-08-08 14:24:38

你有幾分鐘的teamviewer？謝謝你的回答 – Laziale

是的，當然是給我你的身份證，並通過 –

710 045 275/5630 – Laziale

在webapi應用程序中使用角度路由

回答

相關問題