angular 2用户可以单击按钮然后它被禁用

Question

您好，我正在开发 Angular 2 应用程序； 我有实体 article(id , title , text , vote) , account(id) , likes(articleid and userid) 我有一个名为 like 的按钮。 我想如果用户点击按钮就像按钮被禁用并且投票增加一样。 我做了一些有效的代码，但按钮没有被禁用。 这是我在打字稿方面的功能：

Like(Article,likes:Likes) {

    Article.vote += 1;
    this.articleService.modifier(Article)
        .subscribe((res: Article) => this.onSaveSuccess(res), (res: 
    Response) => this.onSaveError(res.json()));

   this.likes= new Likes;
   this.likes.articleid=Article.id;
    this.principal.identity().then((account) => {
        this.currentAccount = account;
    });
    this.likes.userid=this.currentAccount.firstName;
    this.likesService.create(this.likes)
        .subscribe((res: Likes) => this.onSaveSuccess2(res), (res:  
    Response) => this.onSaveError(res.json()));
}

这是 HTML 端：

   <span *ngFor="let article of articles ;trackBy: trackId">
   <div style="margin-left: 30px; padding-top: 20px;">
   <div class="row">
   <h3 >{{article.titre}}</h3><br/>
   <p >{{article.text}}</p><br/>
   <div  > <strong >Publié par</strong><p >{{article.utilisateur}}</p></div>




   <p style="float:right;padding-right: 50px;margin-left: 5px;">    
     {{article.vote}}</p>

<span *ngFor="let likes of likess ;trackBy: trackId">

  <span *ngIf="likes.articleid === article?.id &&
                   likes.userid === account.id">

         <button type= "submit"
                 (click)=" Like(article,likes)"
                 disabled

                 class="btn btn-danger btn-sm">
                        <span class="fa fa-thumbs-up"></span>

                    </button>
    </span>
    <span *ngIf="likes.articleid != article?.id || !likes.articleid  ">

         <button type= "submit"
                 (click)=" Like(article,likes)"


                 class="btn btn-danger btn-sm">
                        <span class="fa fa-thumbs-up"></span>

                    </button>
    </span>

</span>

Answer 1

单击按钮时，将任何属性设置为 true，例如 Article.disabled = true，并在按钮上添加 disabled 指令，例如 [disabled]="article.disabled"。