ng-show가 동시에 업데이트되지 않습니다.

Question

이것은 ng-show 및 bindings와 함께 모호한 질문입니다.

나는 동시에 표시하고 싶지 않은 2 개의 필드가 있습니다. 하나는 "쇼"가 참일 때 보여 주며, 다른 하나는 틀렸을 때 보여줍니다.

특정 옵션을 선택하면이 "show"값이 변경되는 드롭 다운 메뉴가 있습니다.

하지만 두 가지가 동시에 표시되는 매우 짧은 순간이 있습니다. 어떻게 가능한가, 그것을 고치는 방법은 무엇입니까?

Answer 1

var module = angular.module('test', []); 
 

 
function PageCtrl($scope) { 
 
    $scope.msg = 'Select hide/show example'; 
 
    $scope.showFirst = true; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="test" ng-controller="PageCtrl"> 
 
    <p>{{msg}}</p> 
 
    
 
    <select ng-model="showFirst"> 
 
    <option ng-value="true">First</option> 
 
    <option ng-value="false">Second</option> 
 
    </select> 
 
    
 
    <p ng-show="showFirst">This is paragraph one</p> 
 
    
 
    <p ng-hide="showFirst">This is paragraph two</p> 
 
</div>

내가 알아 낸 : 0.5 초의 기본 전환 애니메이션이 있습니다. CSS를 CSS로 재정의해야합니다. 정확하게 ng-hide-add 및 ng-hide-remove 클래스에 있습니다.

Answer 2

ng-show 대신 ng-hide를 사용하고 싶습니다. 그런 다음 양쪽 모두에 $ scope.value를 true로 설정하십시오. 처음에는 ng-hide가 숨겨져 ng-show가 표시되고 $ scope.value에 대해 false로 전환하면 반대 방향으로 반전됩니다. 기본적으로 2 개의 ng-show는 사용하지 말고 ng-hide와 ng-show의 조합을 사용하십시오.

Answer 3

다음은 사용자가 요구하는 가장 간단한 작업 예제입니다. 즉시 변경됩니다. 특정 상황에 대한 더 많은 통찰없이 지연을 야기 할 수있는 것이 무엇인지 말하는 것은 어렵습니다. 그것은 즉시 숨어되지 않은 이유