在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应用程序中使用角度路由

回答

相关问题