ui-sref does not work in bootstrap navbar

Navigation
0

I am using AngularJS v1.6.9, Bootstrap version 3.3.0 and ui-router version v1.0.15 when adding the ui-sref in the bootstrap navbar, it does not change the state, nothing happens when I click on some menu options. 

    <nav class="navbar navbar-inverse sub-navbar navbar-fixed-top">
        <div class="container" ng-controller="menuCtrl">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#subenlaces">
                    <span class="sr-only">Interruptor de Navegación</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#/home">Prueba de concepto</a>
            </div>
            <div class="collapse navbar-collapse" id="subenlaces">
                <ul class="nav navbar-nav navbar-right">
                     <li><a ui-sref="formbasic">Opción enlace</a></li>
                     <li class="dropdown">
                         <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
                             Pasos de formulario
                             <span class="caret"></span>
                         </a>
                         <ul class="dropdown-menu" role="menu">
                             <li><a ui-sref="paso1">Formulario básico</a></li>
                             <li><a ui-sref="formextensive">Formulario extenso</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
    </nav>

in the options of Basic Form and Extended Form does not work either if I put href="#/paso1" or href="#!/formexensive" . In the js I have the already defined states. 

   // para cualquier ruta que no exista redirecciona a /home
    $urlRouterProvider.otherwise('/home');

    //Estados Posibles para la aplicacion
    $stateProvider
        .state('home', {
            url: '/home',
            views: {
                'pageContent': {
                    templateUrl: 'vistas/home.html',
                    controller:  ''
                }
            }
        })
        .state('paso1', {
            url: '/paso1',
            views: {
                'pageContent': {
                    templateUrl: 'vistas/pasos/paso1.html',
                    controller:  ''
                }
            }
        })
        .state('formextensive', {
            url: '/form-extensive',
            views: {
                'pageContent': {
                    templateUrl: 'vistas/form-extensive.html',
                    controller: ''
                }
            }
        })

If I directly go to the path http://localhost/pconcepto/#!/paso1 if it sends me to the view.

    
asked by Alberto Rojas 01.03.2018 в 19:32
source

1 answer

1

Remember that home.html is where you have or should have your ui-view and in turn the directive where you have the menu, then you must load that view first and then load the other views into your home.html.

A good example is SB-ADMIN recommending link 

.state('dashboard', {
        url: '/dashboard',
        templateUrl: 'vistas/home.html',
        controller:  ''
}).state('dashboard.paso1', {
        url: '/paso1',
        views: {
            'pageContent': {
                templateUrl: 'vistas/pasos/paso1.html',
                controller:  ''
            }
        }
    })
    
answered by 01.03.2018 в 20:38
Replace the use of "var" when creating a variable in C # 2.0 PHP Parse XML from a url