单击按钮更改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>