Question

我正在尝试生成简单的切换功能，只要用户点击它就可以用作竖起拇指和拇指向下。问题是我能够看到竖起大拇指图标但是当我点击它时，拇指按下按钮不会显示。请指导。我想要的是：能够在拇指向上和拇指向下之间切换。

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'favorite',
  templateUrl: './favorite.component.html',
  styleUrls: ['./favorite.component.css']
})
export class FavoriteComponent implements OnInit {

  isFavorite : boolean;
  constructor() { }

  ngOnInit() {
  }

  onClick(){
    this.isFavorite=!this.isFavorite;
  }
}

我的.ts文件

<span 
class="glyphicon"
[class.glpyhicon-thumbs-down]="isFavorite"
[class.glyphicon-thumbs-up]="!isFavorite"
(click)="onClick()"
></span>

我的.html文件

我已经安装了bootstrap并且在app.component.html中也提到了最喜欢的元素我是这个网站开发的新手，任何建议都会有所帮助提前谢谢！

Answer 1

而不是[class.glpyhicon-thumbs-down]结构，请你试试下面的

<span
  class="glyphicon"
  [ngClass]="{'glpyhicon-thumbs-down': isFavorite,
  'glyphicon-thumbs-up': !isFavorite}"
  (click) = "onClick()"
  ></span >

Answer 2

  <span 
class="glyphicon"
[class.glyphicon-thumbs-up]="isFavorite"
[class.glyphicon-thumbs-down]="!isFavorite"
(click)="onClick()"
></span>

我得到了它们，我正在将错误的类调用到错误的布尔值。在上面我改变了按钮的位置:)谢谢你的关注

无法切换Glyphicon

2 个答案: