Angular with ngRouter does not work when I type in Browse

Asked

Viewed 584 times

1

I need to type in the Browse...

dominio.com.br/details/1234

...and I need the controller to take this 1234 number and perform your task. I tried everything unsuccessfully.

NOTE: If I create an anchor inside the page linking href the route (<a href="#/detalhes/1234">Rodar Controller</a>) and click on this link, it works normally, but I need it to work by typing in Browse.

Follow my route definition and controller:

angular.module('confirmar.routers', ['ngRoute'])

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

  $routeProvider
    .when('/detalhes/:id', {
      controller: 'DetalhesController'
    })

    .otherwise({redirectTo: '/'});

  $locationProvider.html5Mode(true).hashPrefix('!');
}])

.controller('DetalhesController',['$routeParams', function ($routeParams) {
  console.log('Detalhes exibido sobre o código: ' + $routeParams.id);
}]);

I need it to work by typing in Browse because the customer will receive an email with the link: http://www.dominio.com.br/detalhes/<seu codigo> and when it clicks on this link, it will open the Browse displaying the item details <seu codigo>

  • missing you inform base https://docs.angularjs.org/guide/$Location look at relative links, it says: Relative links Be sure to check all relative links, images, scripts etc. Angular requires you to specify the url base in the head of your main html file (<base href="/my-base/index.html">) unless html5Mode.requireBase is set to false in the html5Mode Definition Object passed to $locationProvider.html5Mode(). With that, relative urls will Always be resolved to this base url, Even if the initial url of the Document was Different.

2 answers

1


If you have not implemented redirect on your server in cases 404 NOT FOUND, your application will not work.

When using HTML5 mode the browser will prompt the full URL to the server whenever the user directly type the URL (or click on a link that does not belong to the application), navigate to another server or refresh the page via refresh. Since your Angularjs application is probably a SPA, it means that the server will return a 404 error since you have not tried to load index.html.

To fix this, you must configure your server to redirect all your requests that result in 404 to your index.html, and then handle unexpected states on your route provider.

Source.

0

I was having a problem with ngRoute in an ASP.NET MVC web application, I decided to pass the parameters I needed to viewbag.

public ActionResult Detalhes(int id){
      ViewBag.ClienteId = id;
      return View();

}

and in the html page step to ng-init:

...<div ng-controller="mycontroller" ng-init="getDetalhes(@ViewBag.ClienteId)>

but if your application is not ASP.NET MVC, you can try injecting $Location into the controller:

$location.path('/myURL/').search({param: 'value'});

or the $routeParams :

config(['$routeProvider', function ($routeProvider) {
        $routeProvider.when('/myURL/:param1', {
            templateUrl: 'path/myPage.html',
            controller: newController
            });
    }]);

And then on the controller:

var param1= $routeParams.param1;

Browser other questions tagged

You are not signed in. Login or sign up in order to post.