Question

我正在使用Angular7。我得到了以下CSS声明：

.carddiv
{
    margin: 0 auto;
    width: 75%;
    cursor: pointer;
}
.gameMessages
{
    text-align: center !important;
    font-size: 3em !important;
}
.messageSuccess
{
    color : green;
}

.messageFailure
{
    color: red;
}

这是HTML：

<section class="carddiv">
   <section class="gameMessages">
       <p [ngClass] = "{'messageSuccess':booli === true,
                        'messageFailure':booli === false}">{{currentMoveMessage}} </p>
</section>
<mat-card class="cardclass" [attr.data-index]="i" *ngFor="let card of cards; index as i"  (click)="onCardClick($event)">
  <mat-card-header class="cardheader">
    <mat-card-title> a card </mat-card-title>
  </mat-card-header> 
  <img [src]="cards[i].pathToShow">
</mat-card>
</section>

在组件类中：

export class CardcomponentComponent implements OnInit 
{
  booli : boolean;
  currentMoveMessage : string;

  constructor(public cardService: CardService) 
  { 
    this.booli = true;
    this.currentMoveMessage = "message";
    ...
  }
...

当我加载页面时，对文本的颜色没有影响。当我直接使用样式时，它可以工作，这意味着像这样：

<p style="color:red"> {{currentMoveMessage}} </p>

ngClass有什么问题？

Answer 1

看看您是否能够在此stackblitz

中复制相同的内容

还应该在LocalBroadcastManager localBroadcastManager = LocalBroadcastManager.getInstance(this); IntentFilter filter = new IntentFilter("com.onezero.EXAMPLE_ACTION"); localBroadcastManager.registerReceiver(new BroadcastReceiver() { @Override public void onReceive(Context context, Intent intent) { // DO WORK setPlayPause(); //PAUSE MEDIAPLAYER IN MY CASE } }, filter);上设置this.booli = true;而不是构造函数，构造函数是一个打字稿功能，ngOnInit()在初始化组件时运行，是否得到ngOnInit来自booli吗？

Answer 2

代码的第一部分没有问题。检查这里：

https://stackblitz.com/edit/angular-kur9tf

我只是复制并粘贴了。它没有问题。

ngClass不影响任何东西

2 个答案: