2015-04-09 5 views
0

У меня есть WebApp, который маршрутизации правильно с использованием стандартного # EX) http://localhost:8080/#/about.htmlAngularJS режим UI-маршрутизатор html5 ломает маршрутизации

При добавлении $ locationProvider.html5Mode (истинный); в мой угловой файл «app.js» он разбивает приложение (представления не отображаются, ссылки не доступны для кликов) ... Я прошел через несколько учебников/примеров, но не могу понять, где проблема. Любая помощь будет оценена по достоинству.

APP.JS

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

.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) { 

    $locationProvider.html5Mode(true); 
    $urlRouterProvider.otherwise('/'); 

    $stateProvider 

    .state('home', { 
     url: '/', 
     templateUrl: '/home-partial.html' 
    }) 
    .state('about', { 
     url: '/about', 
     templateUrl: 'about.html' 
    }); 

}]); 

index.html

<html> 
<head> 
<base href="/"> 

<link href="/assets/css/bootstrap.min.css" rel="stylesheet"> 

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
<script src="assets/js/bootstrap.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.13/angular-ui-router.js"></script> 
<script src="app.js"></script> 
</head> 

<body ng-app="routerApp"> 

<nav> 
<ul class="nav masthead-nav"> 
<li><a ui-sref="home">Home</a></li> 
<li><a ui-sref="about">About</a></li> 
</ul> 
</nav> 

<div class="inner cover">    
<div ui-view></div> 
</div> 
</body> 
</html> 

SERVER.JS

// Call main packages 
//=============================================== 
var express = require('express'); 
var app = express(); 
var mongoose = require('mongoose'); 
var morgan = require('morgan'); 
var bodyParser = require('body-parser') 
var path = require('path'); 



// APP GLOBAL CONFIG 
//=============================================== 

/* connect to the database */ 
mongoose.connect('mongodb://127.0.0.1:27017:/DB'); 

/* set location for static files */ 
app.use(express.static(__dirname + '/public')); 

/* log all HTTP requests to console */ 
app.use(morgan('dev')); 

/* set listen port for conn(s) */ 
app.listen(6070); 

// catch all route 
app.get('*', function (req, res) { 
res.sendFile(path.join(__dirname + '/public/index.html')); 
}); 

ответ

0

После того, как сделать шаг назад и, глядя на это логически, я нашел свою простую ошибку ... $ locationProvider необходимо передать следующим образом:

.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function ($stateProvider, $urlRouterProvider, $locationProvider) { 
     // code 
} 
Смежные вопросы