如何以角度添加可折叠按钮以启动和停止答案

【问题标题】：How to add the collapsible button for start and stop in angular如何以角度添加可折叠按钮以启动和停止
【发布时间】：2021-01-26 18:22:46
【问题描述】：

在我的 Angular 应用程序中，我在该页面中创建了仪表板页面，我创建了一个用于启动或停止的按钮（这是切换）但它无法正常工作。

.component.ts

toggleCollapse(jammer) {
    this.jammer.isCollapsed ? 'START' : 'STOP'
    this.jammer.isCollapsed ? 'START' : 'STOP'
}

.component.html

<button
    type="button"
    class="btn btn-warning"
    (click)="toggleCollapse()">START</button>

但它无法正常工作，任何人都可以帮助我解决这个问题。

【问题讨论】：

请解释一下您所说的“无法正常工作”是什么意思
点击功能不会在开始和停止之间切换（我在html中提到过）
那是因为你从不赋值任何东西
能否请您添加我在代码中犯的任何错误

标签： javascript angular typescript twitter-bootstrap bootstrap-4

【解决方案1】：

我猜你希望按钮的标签是 START 还是 STOP？

isCollapsed: boolean = true;

toggleCollapse() {
    this.isCollapsed = !this.isCollapsed;
}

<button
    type="button"
    class="btn btn-warning"
    (click)="toggleCollapse()">{{isCollapsed? 'START' : 'STOP'}}</button>

【讨论】：

【解决方案2】：

.component.ts

public isCollapsed = false;

toggleCollapse() {
    this.isCollapsed = !this.isCollapsed
}

.component.html

     <button
        type="button"
        [ngClass]="isCollapsed ? 'btn btn-warning' : 'btn btn-success'"
        (click)="toggleCollapse()">
        <span *ngIf="isCollapsed"> Stop <span>
        <span *ngIf="!isCollapsed"> Start <span>
    </button>

注意：您可以根据需要更改布尔值

【讨论】：