2016-05-26 14 views
1

Dieser Code ist funktional, könnte aber besser funktionieren. Meine Frage:Eckiger Router, Controller oft anrufend

Wie kann ich navDetail oder andere Ansichten in vielen Staaten ohne Call-Controller wieder einfügen.

(function() { 
 
    'use strict'; 
 

 
    angular 
 
    .module('miApp') 
 
    .config(routerConfig); 
 

 
    var nav = { 
 
    templateUrl: 'app/nav/nav.html', 
 
    controller: 'NavController', 
 
    controllerAs: 'nav' 
 
    }; 
 
    var navInter = { 
 
    templateUrl: 'app/nav/navInter.html', 
 
    controller: 'NavController', 
 
    controllerAs: 'nav' 
 
    }; 
 
    var navDetalle = { 
 
     templateUrl: 'app/navDetalle/navDetalle.html', 
 
     controller: 'NavDetalleController', 
 
     controllerAs: 'navDetalle'   
 
    }; 
 
    /** @ngInject */ 
 
    function routerConfig($stateProvider, $urlRouterProvider) { 
 

 
    $stateProvider 
 
     .state('home', { 
 
     url: '/', 
 
     views: { 
 
      // the main template will be placed here (relatively named) 
 
      'nav': nav, 
 
      'carousel': { 
 
       templateUrl: 'app/carousel/carousel.html', 
 
       controller: 'CarouselController', 
 
       controllerAs: 'carousel' 
 
      }, 
 
      'footer':{ 
 
       templateUrl: 'app/footer/footer.html' 
 
      } 
 
     } 
 
     }) 
 
     .state('detalle', { 
 
     url: '/detalle/:idDetalle', 
 
     views:{ 
 
      'nav': navInter, 
 
      'detalle': {  
 
       templateUrl: 'app/detalle/detalle.html', 
 
       controller: 'DetalleController', 
 
       controllerAs: 'detalle' 
 
      }, 
 
      'navdetalle': navDetalle, 
 
      'footer':{ 
 
       templateUrl: 'app/footer/footer.html' 
 
      } 
 
     } 
 

 
     }) 
 
     .state('resumen', { 
 
     url: '/resumen', 
 
     views:{ 
 
      'nav': navInter, 
 
      'navdetalle': navDetalle, 
 
      'footer':{ 
 
       templateUrl: 'app/footer/footer.html' 
 
      } 
 
     } 
 

 
     }) 
 
     .state('success', { 
 
     url: '/success', 
 
     views:{ 
 
      'nav': navInter, 
 
      'success': {  
 
       templateUrl: 'app/success/success.html', 
 
       controller: 'SuccessController', 
 
       controllerAs: 'success' 
 
      }, 
 
      'navdetalle': navDetalle, 
 
      'footer':{ 
 
       templateUrl: 'app/footer/footer.html' 
 
      } 
 
     } 
 

 
     }) 
 
     .state('cancel', { 
 
     url: '/cancel', 
 
     views:{ 
 
      'nav': navInter, 
 
      'navdetalle': navDetalle, 
 
      'cancel': {  
 
       templateUrl: 'app/cancel/cancel.html', 
 
       controller: 'CancelController', 
 
       controllerAs: 'cancel' 
 
      }, 
 
      'footer':{ 
 
       templateUrl: 'app/footer/footer.html' 
 
      } 
 
     } 
 

 
     }); 
 

 
    $urlRouterProvider.otherwise('/'); 
 
    } 
 
    
 
})(); 
 

und wenn Sie Vorschlag auf weitere Verbesserungen bitte

+0

Was meinen Sie mit dem Einfügen von navDetale? –

+0

@ShashankAgrawal navDetail ist ein Objekt zur Ansicht des Staates, das Objekt ist oben deklarieren –

+0

Brotha überprüfen Sie dies [Problem] (https://github.com/angular-ui/ui-router/issues/1800) –

Antwort

0

Ich bin mir nicht sicher, ob dies möglich ist, die Ausführung des Controllers jedes Mal zu verhindern. Aber ich habe eine andere Lösung. Das könnte funktionieren. Die Ionic Framework machen dies intern, indem sie den Controller-Status beibehalten.

Erstellen Sie einen globalen Controller und fügen Sie ihn zu <body> oder <html> Tag hinzu, so dass sein Umfang jedes Mal verfügbar sein kann.

app.controller('GlobalController', function($scope) { 

    var navDetalleCtrlInstantiated = false; 

    $scope.$on('$stateChangeStart', function(e, toState, toParams) { 
     if (!navDetalleCtrlInstantiated && toState.views && toState.views.navdetalle) { 
      // Do the common logic on controller instantiation 

      // Mark so that we don't have to do the same logic again 
      navDetalleCtrlInstantiated = true; 
     } 
    }); 
}); 

Ihrer Ansicht:

<body ng-controller="GlobalController"> 
</body> 

Und entfernen Logik von Ihrem NavDetalleController.

0

Kommentar Ich weiß nicht, ob das, was Sie möglich ist, wollen. Weil der UI-Router immer eine neue Instanz für den Controller der Ansicht erstellt, und das macht Sinn, weil jede einzelne Ansicht einen eigenen Bereich hat.

Verwandte Themen