ng-hide/ng-show가 ng-click으로 호출 된 함수에서 작동하지 않습니다.

Question

하나의 영역에 두 개의 화면이 표시되고 ng-hide/ng-show도 동일하게 사용 중입니다 !!

내 코드는 다음과 같습니다 내 HTML에서 컨트롤러

$scope.grid1show = 'true' // intially this grid will shown on page load 
    $scope.grid2show = 'false' // Intially this grid is hide on page load 

    // Function 

    $scope.showGrid = function(){  
     $scope.grid1show = 'false'; 
     $scope.grid2show = 'true'; 
     console.log ("==after==" +$scope.grid1show); 
     console.log ("===after==="+ $scope.grid2show); 
    }; 

내부

<div ng-show="grid1show"> Shown this div initially 
    <span ng-click="showGrid2()">Click for grid2</span> // IT should fire function which should show grid2 and hide grid1 
</div> 

<div ng-show="grid2show"> Hide this div intially </div> 

그러나 콘솔에서이 변화하고 있지만, 실제로 숨어 특정 사업부를 보여주는 아니에요! !

여기에 누락 된 것이 있습니까?

Answer 1

왜 값을 문자열로 저장하고 있습니까?

$scope.grid1show = 'false'; 
$scope.grid2show = 'true'; 

부울 값이 아니어야합니까?

$scope.grid1show = false; 
$scope.grid2show = true;