web-dev-qa-db-fra.com

AngularJS: Comment supprimer #!/(Préfixe bang) de l'URL?

J'ai déjà fait $locationProvider.html5Mode(true); mais cela ne fonctionne pas. Chaque fois que j'accède à http://example.com, il passe à http://example.com/#!/. Le code est donné ici:

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

myApp.config(['$qProvider', function ($qProvider) {
    $qProvider.errorOnUnhandledRejections(false);
}]);

myApp.config(function($stateProvider, $urlRouterProvider,$locationProvider) {
    // For any unmatched url, redirect to EXTRANET home page
    $urlRouterProvider.otherwise('/');
    // Now set up the states
    $stateProvider
    .state('listrole', {
    url: "/list-role",
    views: {
      'main-content': {
        templateUrl: rootUrl+ 'views/main.html',
        controller: 'rolesCtrl'
      }
    }
    })
    $locationProvider.hashPrefix('');
    $locationProvider.html5Mode(true);
});

Mise à jour J'ai ajouté $locationProvider.hashPrefix(''); également mais aucune différence. Permettez-moi également de vous dire que je suis entrer adresse dans la barre d'adresse et frapper entrer. Est-ce que je fais bien? Comment le navigateur trouvera-t-il qu'il n'est pas nécessaire d'actualiser le serveur?

Mise à jour # 2

Idéalement, je veux que l'URL soit http://example.com et http://example.com/#!/list-role à http://example.com/list-role. À l'heure actuelle, http://example.com/list-role donne 404

Mise à jour 3

J'utilise un proxy nginx, si cela aide.

Mise à jour 4

Cache effacé. Maintenant, je peux voir http://example.com au lieu de http://example.com/#! mais http://example.com/list-role donne toujours 404

angularjsroutingangular-ui-routerangularjs-1.6
7
Volatil3

Si vous souhaitez supprimer ce préfixe, ajoutez ce code à votre configuration:

appModule.config(['$locationProvider', function($locationProvider) {
  $locationProvider.hashPrefix('');
}]);

Source ici pour plus d'informations.

Mettre à jour

Si vous voulez supprimer tout le préfixe (# et pas seulement !), vous pouvez essayer cette solution :

1) Activez le mode HTML5 et supprimez le préfixe ! dans la configuration de votre module

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

2) Et définissez ensuite base sur / dans le <head> de votre index.html

<head>
    ...
    <base href="/">
</head>
18
Mistalis

Ajoutez ce qui suit à app.js

app.config(['$locationProvider', function($locationProvider) {

  $locationProvider.hashPrefix('');

}]);
0
Pranav V R

Le code ci-dessous supprimera le point d’exclamation (!) Dans l’URL

$locationProvider.hashPrefix('');

ou bien allez à Problème de routage avec le projet AngularJS en utilisant la configuration yeoman

ça a fonctionné pour moi

0
Shiva

Ajouter à votre fichier HTML <head> <base href="/foldername/"> </head>

et celui-ci est pour votre app.js $locationProvider.html5Mode(true);

ceci est pour .htaccess créer un fichier que vous n’avez pas.

RewriteEngine On 
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d  
RewriteRule ^ - [L]
RewriteRule ^ /foldername/
0
Myco Claro

Si vous êtes dans la pile .NET avec MVC avec AngularJS, voici ce que vous devez faire pour supprimer le "#" de l'URL:

1. Configurez votre href de base dans votre page _Layout:

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

2.Alors, ajoutez ce qui suit dans votre configuration d'application angulaire: 

$locationProvider.html5Mode(true)
$locationProvider.hashPrefix("!");
0
Ramesh Rajendran