Javascript 如何替换其上的子div'；使用angularjs的现有父div？

我有以下代码

html:

<div ng-controller="Test">
         <div ng-click="first()" ng-hide="seconddiv">First
           <div ng-click="second()" ng-show="seconddiv">Second</div> 
         </div>
    </div>

在执行上述代码时：

a） 。默认情况下，我应该只看到

第一个

（我现在可以看到一个：

第一个

）-现在可以了

b） 。然后，如果我单击

First

，那么它应该执行它的

First（）

方法，然后

First

应该替换为

Second（在UI上）

——它不会出现

c） 。然后，如果我单击

Second

，那么它应该只执行

Second（）

方法（除了

Second（）

方法之外，它不应该执行任何其他方法，比如

first（）

）

我请求你在这方面帮助我，我们如何才能做到这一点？提前谢谢

请注意，Html

结构不应该改变，所以应该是相同的

创建。

按角度进行。 您将只有一个功能，

切换

。这将首先将变量

的值从true切换到false，反之亦然。
根据
first
的值，您将显示内容为
first
的div或内容为
Second
的div

您还将重构HTML，如下所示

<div ng-controller="Test">
    <div ng-if="first" ng-click="toggle()">First</div>
    <div ng-if="!first"ng-click="toggle()">Second</div> 
</div>

====
编辑：

或者，您甚至不需要
切换
功能。只需使用
ng单击
expression

<div ng-controller="Test">
    <div ng-if="first" ng-click="first=!first">First</div>
    <div ng-if="!first"ng-click="first=!first">Second</div> 
</div>

走弯路。
您将只有一个功能，
切换
。这将首先将变量
的值从true切换到false，反之亦然。
根据
first
的值，您将显示内容为
first
的div或内容为
Second
的div

您还将重构HTML，如下所示

<div ng-controller="Test">
    <div ng-if="first" ng-click="toggle()">First</div>
    <div ng-if="!first"ng-click="toggle()">Second</div> 
</div>

====
编辑：

或者，您甚至不需要
切换
功能。只需使用
ng单击
expression

<div ng-controller="Test">
    <div ng-if="first" ng-click="first=!first">First</div>
    <div ng-if="!first"ng-click="first=!first">Second</div> 
</div>

使用角度删除jquery这是行不通的；如果您隐藏第一个
div
，那么您也隐藏了它的内容，这恰好是第二个
div
以及文本。即使您对代码进行了适当的更改，您的HTML结构也是错误的。请注意，如果您关心的是angular应用程序中div的准确定位，而不是内容的定位，那么您可能没有使用angular来挖掘其潜力。@Claies，谢谢您的回复，那么它以何种方式工作呢？不要嵌套
div
元素。使用角度删除jquery这是行不通的；如果您隐藏第一个
div
，那么您也隐藏了它的内容，这恰好是第二个
div
以及文本。即使您对代码进行了适当的更改，您的HTML结构也是错误的。作为旁注，如果您关心angular应用程序中div的准确定位，而不是内容的定位，那么您可能没有使用angular来挖掘其潜力。@Claies，谢谢您的回复，那么它可以以何种方式工作？不要嵌套
div
元素。谢谢您的回复。你的第一个很好用！谢谢你的回复。你的第一个很好用！
app.controller('Test',function($scope){
    $scope.first = true;
});