将jQuery代码重构为Angular JS代码

Question

我试图将与jQuery相关的代码重构为角度代码。

我有以下用例。 有四种a标签，对每次点击a标签，它下面的事件处理程序中调用，这使得某些div可见。 例如， a标记事件处理程序之一如下所示：

    $("#fistdiv").css('display','none');
    $("#seconddiv").css('display','none');
    $("#thriddiv").css('display','none');
    $("#fourthdiv").css('display','block');

在这种情况下， fourthdiv可见。 每个div在表中显示特定内容。

我想将此jquery代码重构为angular-js。 那怎么办呢？ 而不是查询dom和绑定事件处理程序，如何用角度来表示？

提前致谢。

Answer 1

很幼稚的方法，但它实际上应该是您需要的：

<a href="#" ng-click="visible = 1">Link 1</a>
<a href="#" ng-click="visible = 2">Link 2</a>
<a href="#" ng-click="visible = 3">Link 3</a>
<a href="#" ng-click="visible = 4">Link 4</a>

<div ng-show="visible == 1">Some content 1</div>
<div ng-show="visible == 2">Some content 2</div>
<div ng-show="visible == 3">Some content 3</div>
<div ng-show="visible == 4">Some content 4</div>

演示： http ： //plnkr.co/edit/QyCzUuBwB4yoAbmsgXid？p = preview

Answer 2

您应该看看这个指令。

https://docs.angularjs.org/api/ng/directive/ngShow