How to use routeHelperProvider for ui-router

[fajarachmadyusup13]

i was follow this style guide, especially in Routing section, but i don't know why, i still get some error, like this

Error: Could not resolve 'hello' from state '' w/z.transitionTo@http://localhost:443/belajar-angularJSLagi/mastering/app/_lib/angular-ui-router.min.js:7:17378 w/z.go@http://localhost:443/belajar-angularJSLagi/mastering/app/_lib/angular-ui-router.min.js:7:16936 G/</i<@http://localhost:443/belajar-angularJSLagi/mastering/app/_lib/angular-ui-router.min.js:7:25826 e/q<@http://localhost:443/belajar-angularJSLagi/mastering/app/_lib/angular.min.js:160:431 f@http://localhost:443/belajar-angularJSLagi/mastering/app/_lib/angular.min.js:47:146 kg/k.defer/c<@http://localhost:443/belajar-angularJSLagi/mastering/app/_lib/angular.min.js:50:68

and here's my code :

`

<title>TES</title>

<!-- index.html -->
<script type="text/javascript" src="_lib/angular.min.js"></script>
<script type="text/javascript" src="_lib/angular-ui-router.min.js"></script>
<script type="text/javascript" src="dashboard/route.dashboard.js"></script>
<script type="text/javascript" src="dashboard/routeHelper.js"></script>

<script type="text/javascript" src="app.js"></script>
<script type="text/javascript" src="helper/app.helper.js"></script>
<script type="text/javascript" src="dashboard/app.dashboard.js"></script>

<style>.active { color: red; font-weight: bold; }</style>

<a ui-sref="hello" ui-sref-active="active">Hello</a>
<a ui-sref="about" ui-sref-active="active">About</a>

<ui-view></ui-view>

`

`(function() {
'use strict';

//app.js
angular
    .module('app', ['app.dashboard', 'app.helper']);

})();`

`(function() {
'use strict';

// app.dashboard.js
angular
    .module('app.dashboard', ['ui.router', 'app.helper']);

})();`

`(function() {
'use strict';

// app.helper.js
angular
    .module('app.helper', []);

})();`

`(function() {
'use strict';

// routerHelper.js
angular
    .module('app.helper')
    .provider('routerHelper', routerHelper);

routerHelper.$inject = ['$locationProvider', '$stateProvider', '$urlRouterProvider'];
/* @ngInject */
function routerHelper($locationProvider, $stateProvider, $urlRouterProvider) {
    /* jshint validthis:true */
    this.$get = RouterHelper;

    $locationProvider.html5Mode(true);

    RouterHelper.$inject = ['$state'];
    /* @ngInject */
    function RouterHelper($state) {
        var hasOtherwise = false;

        var service = {
            configureStates: configureStates,
            getStates: getStates
        };

        return service;

        ///////////////

        function configureStates(states, otherwisePath) {
            states.forEach(function(state) {
                $stateProvider.state(state.state, state.config);
            });
            if (otherwisePath && !hasOtherwise) {
                hasOtherwise = true;
                $urlRouterProvider.otherwise(otherwisePath);
            }
        }

        function getStates() {
            return $state.get();
        }
    }
}

})();
`

`(function() {
'use strict';

// router.dashboard.js
angular
    .module('app.dashboard')
    .run(appRun);

appRun.$inject = ['routerHelper'];

function appRun(routerHelper) {
    routerHelper.configureStates(getStates());
}

function getStates() {
    var = rts[{
        state: 'hello',
        config: {
            abstract: true,
            template: '<h3>YYY<h3/>',
            url: '/hello'
        }
    }, {
        state: 'about',
        config: {
            abstract: true,
            template: '<h3>XXX<h3/>',
            url: '/about'
        }
    }];
    return rts;
}

})();
`

[DanAtkinson]

This sounds more like a question for StackOverflow than an issue with the style guide itself.

[tcrite]

Are you trying to navigate to an abstract state?

[fajarachmadyusup13]

@tcrite yeah, you know whats the problem ?

[tcrite]

@fajarachmadyusup13 to my knowledge, I don't think you can navigate directly to an abstract state.

[fajarachmadyusup13]

@tcrite you have any alternative ways for my problem ?

[tcrite]

@fajarachmadyusup13 I would either create a child state underneath those abstract states and navigate to those, or change the abstract flag to false.

[tcrite]

I use abstract states as like my main template. So if I had some shared navigation or something.

[fajarachmadyusup13]

still need routerHelperProvider or not ?

[fajarachmadyusup13]

i was solved this problem, i set abstract attribute to false