在AngularJS中使用嵌套視圖時如何保留引用？

Question

我有4頁。
英文2頁，法文2頁。

這是4個選項：
ZH>第1頁-內容： 計算機
簡體中文>第2頁-內容： 鍵盤

FR>第1頁-內容： Ordinateur
FR>第2頁-內容： 鍵盤

如何切換嵌套視圖的等效視圖？

我已經整理好了。
https://embed.plnkr.co/SZPp0C8guVeTtcLeWJ3T/

任何幫助表示贊賞！ 謝謝！

---

預期的行為。 當我單擊“ Francais”時，說我在/en/page1/ ，我希望它正確地重新路由到/fr/page1 。

---

實際行為。 當我單擊“ Francais”時，說我在/en/page1/ ，它會將我重新路由到/fr ，但我不知道該如何解決當前的問題。

Answer 1

我派出了一個新的矮人，並對其進行了更新。 面臨的挑戰是觀察路由提供者的范圍，以查看存在哪些先前值。 查看當前狀態和名稱，您可以有條件地在控制器中控制保留哪個視圖。 為此，我創建了一個新功能：

  //evaluate routes
  let checkRouteValues = (oldVal, newVal)=>{
    $scope.vm.message1 = oldVal;
    $scope.vm.message2 = newVal;

    //first check to see if language has changed
    if(newVal === 'english'&& oldVal ==='francais.page1'){
     $state.go('english.page1');
    }else if(newVal === 'english' && oldVal ==='francais.page2'){
         $state.go('english.page2')
    }else if(newVal ==='francais' && oldVal === 'english.page1' ){
        $state.go('francais.page1');
    }else if (newVal ==='francais' && oldVal === 'english.page2' ){
      $state.go('francais.page2');
    }
  }

然后添加手表以查看狀態何時更改：

 //added a watch to monitor the current state
  $scope.currState =$state;
  $scope.$watch('currState.current.name', function (newValue, oldValue){

     checkRouteValues(oldValue, newValue)
  });

函數checkRouteValues（）監視新值和舊值，然后根據條件設置狀態。 * caveat：我認為此解決方案適用於小規模的導航，例如此處的導航，但是，如果您有多個頁面，我會選擇不同的路線。

更新的插頭

我確實在html中添加了一些日志記錄，因此您可以看到值發生了更改，我確實將應用程序的名稱從theApp更改為app，因此如果您cpoy粘貼，請小心。

我確實在代碼中使用了箭頭功能，如果您不喜歡箭頭功能，可以將其轉換回

let checkRouteValues = function(oldVal, newVal){...}

我還使用了let聲明與var來隔離變量作用域，但是可以根據需要使用var。

最后，隨着我的更改，更改路線英語（第一頁）始終是您的應用啟動時默認加載的路線，但這應該足以為您提供幫助。