如何在 Angular 4 中切换（显示/隐藏）元素？

这是我的 html 元素：

<ng-container>
    <span *ngIf="row.messageText && row.messageText.length >= 30 && expanded">{{row.messageText.substr(0, 25)}}
        <span>more</span>
    </span>
</ng-container>

当 row.messageText.length 大于 30 时，它显示消息的一部分。我需要第一个跨度来显示整个消息（通过使用row.messageText.substr()）点击后more跨度。我认为有一个解决方案，可以使用(click)="toggle()"并设置一些真假 values.

你有什么想法？

在 TS 文件中

showMyContainer: boolean = false;

In HTML

<button (click)="showMyContainer=!showMyContainer">Show/Hide</button>

<div *ngIf="showMyContainer">
     your code
</div>

See my

很高兴听到有人得到帮助。