각도 취소 Tabset 클릭

Question

ng-repeat를 사용하여 동적으로 내 탭셋을 만듭니다. 탭 내에는 동적 양식이 있습니다. 사용자가 탭을 클릭하면 컨트롤러는 $ state.go()를 호출하고 다음 양식의 데이터를로드합니다. 최근 양식에 변경 사항을 저장하지 않았는지 확인하고 사용자에게 알리도록 요구했습니다. 나는 훌륭한 일을하는 https://github.com/facultymatt/angular-unsavedChanges을 발견했다. 내가 겪고있는 문제는 사용자가 클릭하면 선택한 탭이 클릭 한 새 탭에 남아있을 때입니다.

$scope.onTabSelect = function (tabId) { 
     $state.go('app.Tabs.TabRender', { 
      recordID: tabId, 
     }); 
    }; 

내가 사용자가 클릭 취소 할 때 방송하는 unsavedChanges 서비스를 수정하고 있음을 캡처 할 수 있습니다 : 그들은 다음 탭을 선택 컨트롤러에서

<div tabset style="align-content: center;"> 
     <div tab ng-repeat="tab in vm.Tabs" heading="{{ tab.Name }}" active="$first" select="onTabSelect(tab.RecordID)"> 
     </div> 
</div> 

:

내 탭처럼 만들어 내 컨트롤러에 올바르게. 유일한 문제는 선택한 탭을 원래 탭으로 다시 설정하는 방법입니다.

Answer 1

각 탭 개체에 활성 속성을 추가하고 사용자가 리디렉션되었는지 여부에 따라 컨트롤러에서 설정합니다.

<div tab ng-repeat="tab in vm.Tabs" heading="{{ tab.Name }}" active="tab.Active" select="onTabSelect(tab.RecordID)"> 

컨트롤러에

:

function setActiveTab(id) { 
     _.each(vm.Tabs, function (tab) { 
      if (tab.RecordID === id) 
       tab.active = true; 
      else 
       tab.active = false; 
     }); 
    } 

    $scope.$on("redirectCancelled", function() { 
     setActiveTab(currentTab); 
    }); 

    $scope.$on("resetResettables", function() { 
     currentTab = redirectTab; 
    }); 

    $scope.onTabSelect = function (tabId) { 
     redirectTab = tabId; 
     setActiveTab(tabId); 

     $state.go('app.Tabs.TabRender', { 
      recordID: tabId, 
     });    
    };