使用在后端角HTML5mode和Servicestack服务时默认index.html页面 [英] Serving default index.html page when using Angular HTML5mode and Servicestack on the backend
问题描述
我是新来ServiceStack和角度。道歉，如果这是冗长。
I am new to ServiceStack and Angular. Apologies if this is verbose.
参照 Html5的pushState的网址可在ServiceStack
我希望能有我的API服务从根担任了。即 http://mydomain.com/
I would like to be able to have my api service served up from the root. ie http://mydomain.com/
如果用户浏览的路线，我想成为那个了我的自举程序角度默认html页面。
If a user browses the route, I would like to serve up a default html page that bootstraps my angular app.
在应用程序本身，如果角度电话mydomain.com/customer/{id~~V} JSON应该送达，但如果这是直接浏览也应该成为默认的HTML页面，并保持URL，但在服务方法的路线不需要被调用。因为这将被角得到解决，这将致电客户服务本身的JSON结果。
In the the app itself if angular calls mydomain.com/customer/{id} json should be served but if this is browsed directly it should serve the default html page and keep the url but the route in the service method does not need to be called. as this will be resolved by angular which will call the customer service itself for a json result.
推荐答案
有可能是几种不同的方法来完成这项工作，只要你不需要支持html5mode的URL。我有希望，我就可以利用这个code 最终支持html5mode，但此刻，我已经辞职了自己基于散列的网址。
There are probably a few different ways to make this work, as long as you don't need to support html5mode urls. I have hope that I'll be able to leverage this code to eventually support html5mode, but at the moment, I've resigned myself to hash based URLs.
由于的URL，如： http://example.com/ 或的 http://example.com/#/customer/ {ID}，这里是如何在自托管servicestack项目bootstap的angularjs单页的应用程序从域的根。
Given urls like: http://example.com/ or http://example.com/#/customer/{id}, here's how to bootstap an angularjs single page app on a self-hosted servicestack project from the root of the domain.
要启用降价剃刀引擎，添加到您的APPHOST配置（不是绝对必要的，但在默认剃刀引擎我的preference）：
To enable the markdown razor engine, add this to your AppHost config (not absolutely necessary, but my preference over the default razor engine):
Plugins.Add(new RazorFormat());
将一个文件，default.md，在项目的根目录下，并保证它的性能内容/副本时，新的。把你在那里想要的任何内容。最重要的是分配模板文件。 （如果你使用的是默认剃刀引擎，等效default.cshtml文件还应该工作，但我从来没有尝试过。）模板文件是什么将引导您angularjs应用程序。这是我在我的default.md：
Place a file, default.md, in the root of your project, and ensure it's properties are "content/copy when newer". Put whatever content you want in there. The important thing is to assign the template file. (If you're using the default razor engine, an equivalent default.cshtml file should also work, but I've never tried it. ) The template file is what will bootstrap your angularjs app. This is what I have in my default.md:
@template "Views\Shared\_Layout.shtml"
# This file only exists in order to trigger the load of the template file,
# which bootstraps the angular.js app
# The content of this file is not rendered by the template.
我_Layout.shtml文件看起来像这样（忽略不相关的细节）。注NG-应用HTML标记，并在体内NG-视图股利。另外请注意，我不包括＆LT;！ - @身体 - ＆GT; 的文件中。我不使用服务器端模板为这个项目。
My _Layout.shtml file looks like this (omitting irrelevant details). Note ng-app in the html tag, and the ng-view div in the body. Also note that I don't include <!--@Body--> in the file. I'm not using server side templates for this project.
<!DOCTYPE html>
<html lang="en" ng-app="MyApp">
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="Content/css/app-specific.css"/>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<!-- Navbar goes here -->
<div class="container">
<header id="header">
<!-- Header goes here -->
</header>
<div ng-view></div>
<hr>
<footer id="footer">
<!-- Footer goes here -->
</footer>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<script src="/Scripts/app-specific/app.js?3ba152" type="text/javascript"></script>
<script src="/Scripts/app-specific/app-services.js?3ba152" type="text/javascript"></script>
<script src="/Scripts/app-specific/app-controllers.js?3ba152" type="text/javascript"></script>
</body>
</html>
这篇关于使用在后端角HTML5mode和Servicestack服务时默认index.html页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
