2016-08-22 555 views
1

我有一個<div>它包含一個<button>。點擊此按鈕時,我想隱藏此<div>,並顯示另一個新的<div>以代替當前的<div>。另外,新的<div>包含<button>,點擊後會打開舊的<div>。這將使我能夠一次打開一個<div>,點擊<div>中的<button>。任何人都可以告訴我如何在AngularJS中做到這一點?AngularJS:顯示其他div和隱藏當前div點擊按鈕

This picture shows my requirement

+0

什麼你試過嗎? plnkrr或小提琴 –

+0

你是什麼意思'代替當前'?你想替換還是想做隱藏表演? –

+0

圖片鏈接不存在 –

回答

1
<body ng-init="showDiv = true"> 

    <div ng-show="showDiv"> 
     <h1>Div 1</h1> 
     <button ng-click="showDiv = false">Show Div 2</button> 
    </div> 
    <div ng-hide="showDiv"> 
     <h1>Div 2</h1> 
     <button ng-click="showDiv = true">Show Div 1</button> 
    </div> 

</body> 

CodePen:https://codepen.io/RaymondAtivie/pen/OXYRyE

+0

Div 1隱藏,但Div 2不出現在單擊「顯示Div 2」按鈕上。你能告訴我這個工作的例子嗎? –

+0

@ k-感染我做了一個編輯嘗試。當我在代碼筆上工作 –

+0

@ k-infected我已經包含一個codepen樣本 –

0

請嘗試類似下面:使用NG-點擊和NG-顯示

<div ng-show="!showDiv"> 
     <button ng-click="showDiv=true"></button> 
     </div> 
     <div ng-show="showDiv"> 
    <button ng-click="showDiv=false"></button> 
     </div> 
0

使用ngShow

<div ng-show="condition" ng-init="condition = true"> 
    <button ng-click="condition = false">Toggle</button> 
</div> 
<div ng-show="!condition"> 
    <button ng-click="condition = true">Toggle</button> 
</div> 

但牢記像單獨的邏輯從視圖切換到ngClick並將其放入控制器。