AngularJS: ne peut pas obtenir en mode html5 url avec l'interface utilisateur de l'itinéraire $état
Je suis en utilisant l'interface utilisateur du routeur pour la gestion de l'état, mais je pense que je vais avoir des ennuis avec ma .htaccess règles de réécriture. Tous mes états travaillé lors de l'utilisation de //no de compte des url du style. Maintenant, j'ai activé le mode html5, mais mon application n'est pas rendu ce qu'il était avant. Il semble à ma charge index.html et tous mes fichiers css et js, etc. mais pas de réagir tous les états.
Voici ma structure de dossier:
root/
app/
components/
angular/
...
images/
scripts/
controllers/
directives/
...
app.js
styles/
views/
.htaccess
...
Mes vhosts DocumentRoot points à mon app/
Voici mon app.js avec mes états:
'use strict';
angular.module('appointeddPortalApp', ['ngResource', 'ui.state', 'ui.compat', 'fundoo.services', 'ui.date', 'ngCookies'])
.config(function ($stateProvider, $routeProvider, $locationProvider, $httpProvider) {
var access = routingConfig.accessLevels;
delete $httpProvider.defaults.headers.common["X-Requested-With"];
$httpProvider.defaults.useXDomain = true;
$locationProvider.html5Mode(true);
$stateProvider
.state('root', {
abstract: true,
url: '',
views: {
'header': {
templateUrl: 'views/partials/header.html'
},
'search': {
templateUrl: 'views/partials/search.html',
controller: 'SearchCtrl'
},
'main': {
templateUrl: 'views/main.html',
controller: 'MainCtrl'
},
'footer': {
templateUrl: 'views/partials/footer.html'
},
},
})
.state('root.home', {
url: '',
views: {
'content': {
templateUrl: 'views/home/index.html',
controller: 'MainCtrl',
}
},
access: access.anon
})
.state('root.about', {
url: '/about',
parent: 'root',
views: {
'content': {
templateUrl: 'views/about.html',
controller: 'StaticCtrl'
},
'search@': {}
},
access: access.anon
})
.state('root.search', {
url: '/search/:city/:category',
views: {
'content': {
templateUrl: 'views/search.html',
controller: 'SearchCtrl'
}
},
access: access.anon
})
.state('root.salons_profile', {
url: '/salons/{id}',
views: {
'content': {
templateUrl: 'views/salons.profile.html',
controller: 'SalonCtrl',
},
'search@': {}
},
access: access.anon
})
.state('root.account', {
url: '/account',
abstract: true,
views: {
'content': {
templateUrl: 'views/user/account.html',
controller: 'AccountCtrl'
}
},
})
.state('root.account.info', {
url: '',
views: {
'account_head': {
templateUrl: 'views/user/account.head.html',
},
'account_body': {
templateUrl: 'views/user/account.my_appointedd.html',
},
},
menus: {
'account': {
identifier: 'my_appointedd',
class: 'active'
}
},
access: access.user
})
.state('root.account.appointments', {
url: '/appointments',
views: {
'account_head': {
templateUrl: 'views/user/account.head.html',
},
'account_body': {
templateUrl: 'views/user/account.appointments.html',
},
},
menus: {
'account': {
identifier: 'appointments',
class: 'active'
}
},
access: access.user
})
.state('root.account.details', {
abstract: true,
views: {
'account_head': {
templateUrl: 'views/user/account.head.html',
},
'account_body': {
templateUrl: 'views/user/account.details.html',
},
},
access: access.user
})
.state('root.account.details.account', {
url: '/details',
views: {
'right': {
templateUrl: 'views/user/account.details.account.html',
},
},
menus: {
'account': {
identifier: 'details',
class: 'active'
},
'settings': {
identifier: 'account',
class: 'active'
}
},
access: access.user
})
.state('root.account.details.profile', {
url: '/profile',
views: {
'right': {
templateUrl: 'views/user/account.details.profile.html',
},
},
menus: {
'account': {
identifier: 'details',
class: 'active'
},
'settings': {
identifier: 'profile',
class: 'active'
}
},
access: access.user
});
})
.run( [ '$location', '$state', '$stateParams', '$rootScope', '$cookies', 'Auth', function( $location, $state, $stateParams, $rootScope, $cookies, Auth){
$rootScope.client_id = '51a741eb3152c3ae7e000103';
$rootScope.$state = $state;
$rootScope.$stateParams = $stateParams;
$rootScope.$cookies = $cookies;
$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams){
if (!Auth.authorize(toState.access)) {
if(Auth.isLoggedIn()) $state.transitionTo('root.account');
else $state.transitionTo('root.home');
}
});
Voici mon réécrire le code qui se trouve dans .htaccess dans /app. Je pense que c'est peut être faux.
<IfModule mod_rewrite.c>
Options +FollowSymLinks
RewriteEngine On
RewriteBase /
RewriteRule ^(components|images|scripts|styles|views)($|/) - [L]
RewriteRule ^(.*)$ index.html [L]
</IfModule>
OriginalL'auteur iamjonesy | 2013-07-03
Vous devez vous connecter pour publier un commentaire.
Cette configuration a travaillé pour beaucoup de nos utilisateurs d'Apache à l'aide de html5mode et ui-router.
Aussi s'il vous plaît assurez-vous que vous n'êtes pas une victime de
<base href>
bug. Voir la l'interface utilisateur du routeur FAQ pour plus d'info.vous rock. +1. les noobs... vous pouvez tout laisser tomber pour partir à l'intérieur de la
<Directory
nœud .htaccess à la racine et vous aurez le même effet sur votre hébergeur. cheers!dans drupal comment est définie lorsque j'ai mis cette règle de 500 Erreur Interne du Serveur s'il vous plaît aider
Mais n'est alors pas tous la route perdue et je reçois toujours redirigé vers la maison? E. g.
mypage.de/abc
serez redirigé versmypage.de/index.html
au lieu demypage.de/#/abc
Cela ne semble pas fonctionner avec enfant, les états "admin.les classes". J'obtiens une erreur 404 not found. J'ai ajouté cette règle à mon fichier htaccess: RewriteRule ^admin/(.*)$ /$1 [R,L]. Quand je fais un rechargement de la page /admin/classes. Je reçois dirigés vers les classes.
OriginalL'auteur Tim Kindberg
Si vous travaillez dans un hébergement mutualisé qui ne permet pas de modifier la configuration d'Apache, vous pouvez le faire dans votre
.htaccess
fichier afin de le rendre$locationProvider.html5Mode(true)
de travail (comme @Shanimal pointé dans @nfiniteloop réponse):Et n'oubliez pas d'ajouter
<base href="/path/to/app/">
dans le code HTML<head>
.OriginalL'auteur campsjos