單擊按鈕更改div

Question

我是新來front-end 。 現在，在這里我有3 divs ，它們將在同一頁面上。位置也將相同。 這就像在切換。 因此，一開始，這將是我將展示的div

<div text-angular id="htmlEditorId" >Abc</div>

然后有按鈕的鞭子就像

<button class="col-xs-3 btn btn-default" ng-click="changeTab()">NextTab </button>

單擊該按鈕

<div text-angular id="secon">abcd</div>

該div應該顯示，而不是前一個。

然后再次點擊該按鈕的第三格

<div text-angular id="third">azzzbcd</div>

這應該被看到，並且再次單擊應該顯示一個。 它就像一個循環式的時尚。

現在我嘗試使用ng-show和ng-if 。 誰能幫我這個？

$scope.changeTab = function() {
     $scope.showfirst = true;
  $scope.showsecond = false;
}

Answer 1

這很簡單，您可以通過多種方式來做到這一點，例如：

在控制器中定義范圍變量（可與前端綁定）

$scope.showView = "firstView"

還定義一個函數：

$scope.changeView = function(value) {
     $scope.showView = value;
}

在html頁面中定義div和按鈕

<button ng-click="changeView('secondView')">Chage View</button>

<div ng-show="showView == 'firstView'">abcd</div>
<div ng-show="showView == 'secondView'">abcd</div>