1

I'm just assigned on a SPA (angularJS) project where view routing is maintained with traditional ngRoute. For now I'm not allowed to move all the routing to state based 'UI.Routing' but they permits me i can use ui routing with the new features i will add to the current codebase.So i was thinking if there is way i can work with ui.routing inside of an ng-routing application.

I'm just doing R&D on a sample app where i've put an ng-view and then inside of a specific view i tried to do ui-view but didn't come out with any positive response yet. So i'm just wondering is it really gonna work or i'm just wasting my time.

<!DOCTYPE html>
<html ng-app="app">
<head>
    <title>UI Router with ngRoute</title>
 <meta charset="utf-8" />
</head>
<body>


    <div ng-view="">

    </div>

    <!-- Vendor Scripts -->
    <script src="vendor/angular/angular.min.js"></script>
    <script src="vendor/angular-route/angular-route.min.js"></script>
    <script src="vendor/angular-ui-router/release/angular-ui-router.min.js"></script>

    <script src="app/app.js"></script>
    <script src="app/settings/routing.js"></script>
    <script src="app/settings/uiRouting.js"></script>
</body>
</html>
enter code here
angular.module('app', [
    // Angular modules 
    'ngRoute',

    // Custom modules 

    // 3rd Party Modules
    'ui.router'
]);



enter code here
routeManager.$inject = ['$routeProvider'];

function routeManager($routeProvider) {
    $routeProvider
        .when('/home', {
            templateUrl: 'app/settings/shell.html'
        }).otherwise({
            redirectTo: '/home'
        });
}

angular
    .module('app')
    .config(routeManager);

enter code here
routeManager.$inject = ['$stateProvider','$urlRouterProvider'];

function routeManager($stateProvider, $urlRouterProvider) {
    $stateProvider
        .state('test', {
            url: '/test',
            template: 'Mashallah'
        });

    $urlRouterProvider.when('', '/test');
}

angular
    .module('app')
    .config(routeManager);

enter image description here

Hoping for a positive reply Thanks

  • 2
    Please don't mess up the code with 2 routers. It should work, but your colleagues will kill you after :) – Stepan Suvorov Feb 27 '16 at 10:15
  • Yes, you can, I've described the solution in [the other thread](https://stackoverflow.com/questions/27691897/can-we-use-ngroute-and-ui-router-together-in-angularjs-app-js/48594149#48594149) – Fyodor Feb 03 '18 at 05:15

0 Answers0