Điều gì sẽ xảy ra khi có mã bên dưới $ location.path ('new/path')?

Question

Nếu tôi thực hiện thay đổi đường dẫn như $location.path('new/path'), điều gì sẽ xảy ra với mã bên dưới thay đổi đường dẫn này? Theo tôi hiểu, thay đổi đường dẫn không ngăn phần còn lại của mã chạy, nhưng điều gì đang thực sự xảy ra? Mã sẽ kết thúc và chỉ khi đó đường dẫn sẽ thay đổi? Vì vậy, nếu mã này là rất tốn thời gian (nói lưu một cái gì đó đến một máy chủ trên một kết nối mạng chậm), sẽ thay đổi vị trí sẽ được tương tự muộn? Hay mọi thứ sẽ xảy ra song song?

Answer 1

Here's a small test, có vẻ như nó kết thúc chạy mã, sau đó thay đổi vị trí. Có một cái nhìn tại giao diện điều khiển trong jsfiddle, bạn sẽ thấy cả hai vòng lặp đi, nhưng cái khác.

Khi @SilverlightFox chỉ ra, không có xử lý song song trong 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++ 
    } 
} 

Nếu code in HomeCtrl is changed để bao gồm một thời gian chờ, vị trí thay đổi đầu tiên vì thời gian chờ phá vỡ dòng chảy của chương trình và lịch trình thời gian chờ thi hành sau các AboutCtrl thực thi.

//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) 
} 

Giống như thời gian chờ: thay đổi vị trí ',' chạy vòng lặp, sau đó yêu cầu http kết thúc. Vì vậy, một cuộc gọi ajax để cập nhật cơ sở dữ liệu trên kết nối chậm sẽ không ngăn ứng dụng thay đổi tuyến đường.

//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++; 
     }   
    }); 

Nếu tôi đã thay đổi tuyến đường vì một cuộc gọi mạng, tôi sẽ làm điều đó trong succes/lỗi lời hứa hoặc gọi lại, nếu đó là ý định.