js 코드에서 click 이벤트의 요소를 표시하거나 숨기려면 어떻게해야합니까?

Question

Jquery를 광범위하게 사용했습니다. Angularjs를 우연히 만났을 때, 나는 그것이 어떻게 작동하는지 이해하려고 노력했고, 그것이 작동하는 AutoMagic 방식에 대해 정말로 흥분했습니다. 예를 들어 ng-click, ng-hide & ng-show을 사용하여 다음 블록을 숨기고 표시하는 과정을 수행 할 수 있습니다.

<form id="signup-form" ng-submit="processForm()" ng-hide="showConfirm" > 
    <input type="text" name="user" ng-model="name"> 
    <button type="submit" id="submit" ng-click="showConfirm = ! showConfirm">Submit</button> 
</form> 

<div class="col-md-12 confirmation" ng-show="showConfirm"> 
     <h2 >Thanks alot for your feedback.</h1> 
</div> 

하지만 컨트롤러에서 말하는 것과 같이 코드에서 어떻게 동일한 작업을 수행 할 수 있는지 궁금합니다. JQuery와에서 할 수있는 한 가지 방법은 같은 것입니다 :

$("#submit").click(function() { 
    $(".confirmation").show(); 
    $("#signup-form").hide(); 
}); 

내가 양식을 유효성을 검사 할 경우 어쩌면 내가 JQuery와에 .preventDefault();를 사용하여 뭔가를 할 수 있습니다. 이 모든 것이 AngularJs에서 어떻게 작동합니까?

Answer 1

그냥 컨트롤러에서 모델 값을 변경 : showConfirm = !showConfirm;

이 자동으로 이미 자리에있는 ng-hide 및 ng-show 지시어를 사용하여보기를 업데이트합니다. 더 좋은

---

은 같은 범위의 함수를 호출 :

$scope.toggleConfirm = function() { showConfirm = !showConfirm; } 

... 그리고 코드 DRY을 유지하기 위해 ng-click="toggleConfirm()"를 사용하여보기에 그를 호출합니다.