Angular.js html5mode（true）和普通锚点href链接？

好了，所以这个问题是这样的：Angular.js html5mode（true）和普通锚点href链接？

我想有这样http://www.domain.com/bla没有http://www.domain.com/#/bla

的URL我解决了使用html5mode（真）。非常适合我！

但现在当用户进入（直接在地址栏键入它为例）//www.domain.com/bla他将没有显示，因为角只是URL重写，在加载＃网址。所以实际上//www.domain.com/bla不存在为url。

我的问题是，我该怎么让页面//www.domain.com/#/bla当用户进入//www.domain.com/bla？（这必须从后端进行，在我的情况node.js）

我认为这与它有关//github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-configure-your-server -to-工作与-html5mode

但这是UI的路由器，我想，以避免它。

来源

2014-10-11 Dusan J.

你在使用UI.router吗？ – 2014-10-11 22:30:52

我正在使用角度路由器。 – 2014-10-12 08:16:17

你可以发布你使用的代码吗？ HTML和角度。 – 2014-10-12 12:25:32

格式使用HTML head标签基地 HREF设置自己的基本网址

<head> 

    <base href="/set your base url"> 
</head>

如果你是一个Apache服务器上运行的应用程序的角度，你可以很容易地在一个.htaccess文件添加此规则。

# Apache .htaccess 

# angularjs pushstate (history) support: 
# See http://www.josscrowcroft.com/2012/code/htaccess-for-html5-history-pushstate-url-routing/ 
<ifModule mod_rewrite.c> 
    RewriteEngine On 
    RewriteCond %{REQUEST_FILENAME} !-f 
    RewriteCond %{REQUEST_FILENAME} !-d 
    RewriteCond %{REQUEST_URI} !index 
    RewriteCond %{REQUEST_URI} !.*\.(css¦js|html|png) #Add extra extensions needed. 
    RewriteRule (.*) index.html [L] 
</ifModule>

如果节点JS表示使用该应用JS

$locationProvider.html5Mode(true).hashPrefix('!');`

您的节点JS

var express = require('express'), 
    app = express(); 

//initialize static server that will spit out contents of public folder 
app.use('/', express.static(__dirname + '/public')); 

app.listen(9823); //the express server will start on port 9823 
console.log('started');

来源

2014-10-11 22:08:04

我正在使用nodejs作为后端。至于头部的基础标签，我在所有页面上使用相同的头部。我应该完全放入href属性中。 www.domain.com或/ url-of-this-particular-page – 2014-10-12 08:15:38

set un base tag href ='/ domain'and try – 2014-10-12 08:17:41

它不适用于。我在http：// localhost：3000 /上托管它，并且我想要的页面位于/ register – 2014-10-12 08:27:58

我真的不知道该怎么回答你的问题没有什么想法你代码看起来像。不过，我可以发布一个适用于你想要的东西的例子。另一方面，我会使用Angular的UI-Router而不是ngRouter。我发现与它合作很容易。对于你想要的，这在ui.router中很容易做到。

HTML：

<body ng-app="someApp"> 
    <nav class="whatever"> 
    <ul class='nav navbar-nav'> 
     <li><a ui-sref='new_page'>Whatever</a></li> 
    </ul> 
    </nav> 
    <div ui-view></div> 
</body>

角：

var someApp = angular.module('SomeApp', ['ui.router']); 

someApp.config(['$stateProvider', '$locationProvider', function($stateProvider, $locationProvider) { 
$locationProvider.html5Mode(true); 

$stateProvider.state('landing', { 
    url: '/', 
    controller: 'Landing', 
    templateUrl: '/templates/landing.html' 
}); 

$stateProvider.state('new_page', { 
    url: '/', 
    controller: 'NewPage', 
    templateUrl: '/templates/new_page.html' 
}); 
}]);

当然，你不需要单独的控制器，但我为你在这里提供一个。我从最近完成的项目中抽取了这个示例代码，所以我知道它的工作原理。例如，您将能够使用localhost/#/和localhost/landing访问您的页面。

来源

2014-10-12 14:49:49

Angular.js html5mode（true）和普通锚点href链接？

回答

相关问题