按住angular4键并单击div上的函数

Question

我想在页面加载后只看到div-2，然后在单击div-2之后，我想隐藏div-2并显示div-1。

<div class="div-1"><p>content 1</p></div>
<div class="div-2" (click)="on = true"><p>content 2</p></div>

Answer 1

在您的组件ts文件中，您需要有一个标记来显示和隐藏目录，如下所示：

ts：

// set to true as we want to show div-2 at first 
public showDiv2: boolean = true;

在html中，我们将使用标志showDiv2来隐藏和显示div：

html：

<div class="div-1" *ngIf="!showDiv2"><p>content 1</p></div>
<div class="div-2" *ngIf="showDiv2" (click)="showDiv2 = false"><p>content 2</p></div>

您可以阅读有关ngIf here的更多信息