Cosa succede quando c'è un codice sotto un $ location.path ('new/path')?

Question

Se eseguo un cambio di percorso come $location.path('new/path'), cosa succede con il codice sotto questo cambio di percorso? Come ho capito, un cambio di percorso non impedisce al resto del codice di funzionare, ma cosa sta realmente accadendo? Il codice verrà completato e solo allora il percorso cambierà? Quindi, se questo codice richiede molto tempo (ad esempio, salvare qualcosa su un server con una connessione di rete lenta), la modifica della posizione sarà altrettanto in ritardo? O le cose accadranno in parallelo?

Answer 1

Here's a small test, sembra che completi il ​​codice, quindi cambia la posizione. Dai un'occhiata alla console nel jsfiddle, vedrai andare entrambi i loop, ma uno dopo l'altro.

Come @SilverlightFox fa notare, non esiste un'elaborazione parallela in javascript.

//this one loads first, executes the loop, then changes location. 
function HomeCtrl($scope, $location) { 
    $location.path('/about'); 
    var i = 0; 
    while(i < 1000000000) { 
     if(i % 100000000 === 0) { 
      console.log('home') 
     } 
     i++; 
    } 
} 

//this loop executes second. 
function AboutCtrl($scope) { 
    $scope.name = 'John'; 
    var i = 0; 
    while(i < 1000000000) { 
     if(i % 100000000 === 0) { 
      console.log('about') 
     } 
     i++ 
    } 
} 

Se il code in HomeCtrl is changed per includere un timeout, la posizione cambia in primo luogo perché il timeout rompe il flusso del programma e gli orari il timeout per eseguire dopo i AboutCtrl esegue.

//changes location first, executes AboutCtrl, then does the "home" loop 
function HomeCtrl($scope, $location) { 
    $location.path('/about'); 
    setTimeout(function() { 
     var i = 0; 
     while(i < 1000000000) { 
      if(i % 100000000 === 0) { 
       console.log('home') 
      } 
      i++; 
     }   
    }, 1) 
} 

Con un proper async request è la stessa come il timeout: cambia location, 'About' piste Ciclo, quindi le finiture richiesta HTTP. Quindi, una chiamata ajax per aggiornare i database su una connessione lenta non impedisce all'applicazione di cambiare rotta.

//changes location, executes 'AboutCtrl', then finishes the http request and 
//executes the 'home' loop. 
function HomeCtrl($scope, $location, $http) { 
    $location.path('/about'); 
    $http.get('/echo/json/').success(function() { 
     var i = 0; 
     while(i < 1000000000) { 
      if(i % 100000000 === 0) { 
       console.log('home') 
      } 
      i++; 
     }   
    }); 

Se stavo cambiando percorso a causa di una chiamata di rete, lo farei in succes/promessa di errore o di callback, se questo era l'intenzione.