angular - 关于 twitter 类型跟随/取消关注 Angular 功能的基本概念？

Question

登录任何用户并查看另一个用户名称的列表，并且名称前面有一个按钮关注，单击关注按钮后，它会切换并将名称更改为取消关注后取消关注按钮再次切换并更改关注如何使这种类型的关注取消关注角度的功能？

在数据库中我有用户表，我必须创建新的跟随表（需要哪一列才能做到这一点），跟随需要哪种类型的查询，取消关注需要哪种类型的查询？

标签： angular

Answer 1

//here is toggle button code 
//twitter-component.html

<style>
    .followup{
        color: red
    }

    .unfollow{
        color: green
    }
</style> 
<form>

<button [ngClass]="{'followup' : isFollow == true,
    'unfollow' : isFollow== false }" 
    (click)="onClick()">
    {{isFollow == true ? 'Unfollow' : (isFollow == false ? 'Follow' : '')}}
</button>
</form>

//twitter-component.ts

export class TwitterComponent implements OnInit {

  public isFollow: boolean = false;
  ngOnInit() {

  }

  onClick(){
    this.isFollow = !this.isFollow;

  }
}