3

私は ngClass で遊んでいますが、何が間違っているのかわかりません。奇妙な行動を示しています。関数を ngClass に割り当てると機能しないようですが、オブジェクトリテラルを割り当てると機能します。コンポーネントの関数で ngClass を動作させるにはどうすればよいですか?

ProposalForm.ts

import {Component} from 'angular2/core';
import {NgClass}    from 'angular2/common';
@Component({
  selector: 'proposal-form',
  template: `
   <div [ngClass]="setClasses()">
    ghtfhg
  </div>
  <div [ngClass]="{active:true, disabled:true}">
    1111111
  </div>`,
  directives:[NgClass]
})
export class ProposalForm {

  setClasses() {
   return {active:true, disabled:true};
  }
}

Chromeのインスペクターを見ると、これはHTMLです

<proposal-form _ngcontent-xxb-2="">
<div class="">
  ghtfhg
</div>
<div class="active disabled">
  1111111
</div></proposal-form>
4

2 に答える 2

2

@Wシェル。あなたはすべてを正しく行っています。ただし、この問題を angular チームに報告したところ、これがバグであることが確認されました。メソッド setClasses を使用してコンポーネントから持っているようなクラスの設定は、Angular2 の最近のいくつかのビルドでは機能しません。今のところ、次のようにクラスを動的にインラインに設定する必要があります。

[ngClass]="{active: isOn, disabled: isDisabled}"

報告された問題のように: https://github.com/angular/angular/issues/7426

于 2016-03-09T17:53:43.923 に答える
1

何が、またはどのように機能していないかについて、多くの情報を提供していません。問題は、setClasses()常に別のオブジェクトを返すことであり、Angulars の変更検出がそれを好まないことだと思います。

代わりにフィールドにバインドする必要があります

classes = {active:true, disabled:true};

classes次に、依存する値が変更されたときに の値を更新します。

于 2016-03-09T17:41:36.003 に答える