如何在js代码的点击事件上显示/隐藏元素？

我曾经广泛使用Jquery。现在我偶然发现了Angularjs，我正在试着理解它是如何工作的，而且我对它的AutoMagic方式非常兴奋。例如，我可以通过使用ng-click,ng-hide & ng-show来完成隐藏和显示几个块的下面的过程。如何在js代码的点击事件上显示/隐藏元素？

<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中如何工作？

来源

2014-10-02 esafwan

请参阅：[我如何在AngularJS中思考如果我有jQuery背景？]（http://stackoverflow.com/q/14994391/1313143）。 – MarioDS 2014-10-02 17:50:29

https://docs.angularjs.org/guide/forms有关于验证的信息.. – smerny 2014-10-02 17:51:21

在你的控制器就改变模型值：showConfirm = !showConfirm;

这将自动更新，使用ng-hide和ng-show指令，你已经到位的观点。

更重要的是，调用一个函数范围的，如：

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

...并使用ng-click="toggleConfirm()"保持代码DRY调用，在你的看法。

来源

2014-10-02 17:51:27 Blazemonger

如何在js代码的点击事件上显示/隐藏元素？

回答

相关问题