samedi 20 février 2016

HTML5 Mode in angularjs not working as expected

I am working with Laravel 5.1 on the back-end with Angular 1.0 on the front-end. I'm having some trouble switching from the hashbang mode to the HTML5 mode for routing. When in hashbang mode, angular routes as expected, but when I switch to HTML5 mode it leads to a full page reload for every new url visited. For a catch-all route in Laravel, I am catching all NotFoundHttpExceptions and returning the shell page view with the response. The code is given below for reference.

routes.php

<?php

Route::any('/', function () {

    return view('templates.entry');

});

routes.js

(function(){
    angular.module('ReminderProd')
    .config(['$stateProvider', '$urlRouterProvider','$locationProvider', function($stateProvider, $urlRouterProvider,$locationProvider) {
        $urlRouterProvider.otherwise('/');
        $locationProvider.html5Mode(true);


        $stateProvider
            .state('reg', {
                url:'/users/reg',
                views: {
                    'reg_form' : {
                        templateUrl: 'templates/pages/entry/reg',
                        controller: 'FormController',
                        controllerAs: 'formCtrl'
                    }
                }
            })
            .state('login', {
                url: '/users/login',
                views: {
                    'login_form': {
                        templateUrl: 'templates/pages/entry/login',
                        controller: 'FormController',
                        controllerAs: "formCtrl"
                    }
                }
            })
    }]);
})();

Handler.php (just the exception handling function shown here)

/**
 * Render an exception into an HTTP response.
 *
 * @param  \Illuminate\Http\Request  $request
 * @param  \Exception  $e
 * @return \Illuminate\Http\Response
 */
public function render($request, Exception $e)
{
    if ($e instanceof ModelNotFoundException) {
        $e = new NotFoundHttpException($e->getMessage(), $e);
    }

    if($e instanceof NotFoundHttpException){
        //TODO: check for mobile requests and handle accordingly

        //code for handling web routes
        return response()->view('templates.entry');
    }

    return parent::render($request, $e);
}

For reference, my base url is reminderprod.dev. If anyone can figure out what is wrong with this code and/or why going to a new url causes a full page reload, please let me know.



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire