Angular2を使用して要素のクラスを削除

Question

2つの要素があります。 1つの要素がホバリングされている場合、別の要素の1つのクラスを削除する必要があります。

import {Component} from '@angular/core' 

@Component({ 
    selector:'display' 
    template:` 

    <div #myname /> 
    <p class="DN"> My name is Dude...</p> 

    ` 

}) 
export class DisplayComponent{ 
} 

divがホバーされるとpタグのクラスDNが除去されるべきです。

Answer 1

あなたはNgClassディレクティブとmouseenterとmouseleaveイベントを活用できます。

import {Component} from '@angular/core' 

@Component({ 
    selector:'display' 
    template:` 

    <div (mouseenter)="showDNClass = false" (mouseleave)="showDNClass = true" #myname /> 
    <p [ngClass]="{ 'DN': showDNClass }"> My name is Dude...</p> 

    ` 

}) 
export class DisplayComponent { 
    private showDNClass: boolean = true; 
} 

---

は、使用例のためPlunkerを参照してください