ngClass] と [class] のバインディングの違いについて

質問

Angular2において、以下のスニペットの違いは何ですか。

<div [class.extra-sparkle]="isDelightful">
<div [ngClass]="{'extra-sparkle': isDelightful}">

どのように解決するのですか？

これはAngularの特殊なバインディング構文です。

<div [class.extra-sparkle]="isDelightful">

これは Angular コンパイラの一部で、このバインディングスタイルに従ったカスタムバインディングバリアントを構築することはできません。唯一サポートされているのは [class.xxx]="..." , [style.xxx]="..." そして [attr.xxx]="..."

ngClass は通常のAngularディレクティブで、自分でビルドすることができます。

<div [ngClass]="{'extra-sparkle': isDelightful}">

ngClass はより強力です。クラスの文字列、文字列の配列、または例のようなオブジェクトをバインドすることができます。