コンポーネントのプロパティを変更することはできません

Question

私はAngular2を初めて使うので、まだ分かりません。私は次のテンプレート持っているコンポーネントに移動するには

@Component({ 
    selector: 'game-card', 
    templateUrl: 'assets/js/app/play/game-card.html', 
    directives: [NgIf, ReferencesModalComponent] 
}) 

export class GameCardComponent 
{ 
    public showUserReferences: boolean = false; 

    public showUserReferencesModal() 
    { 
     this.showUserReferences = true; 
    } 
} 

：私は、次のコンポーネントを作成し

<div> 
    <references-modal *ngIf="showUserReferences == true"></references-modal> 

    <button class="basic-link" (click)="showUserReferencesModal()"> 
     <small>Références</small> 
    </button> 
</div> 

問題は、メソッドが正常に呼び出されたということですが、this.showUserReferencesの値が変わることはありませんが...正直言って、その値を変更した直後にプロパティを印刷するといいです。しかし、我々はメソッドを再度呼び出すと、値が変更されていない...

EDIT

は、あなたの答えのために皆に感謝します。私は最終的に問題が何かを発見しました。 NgForループでコンポーネントを呼び出していました。

<div *ngFor="#results of getResults()"></div> 

問題は、メソッドをループすることでした。私はgetResults（）を単純な配列に置き換えました。今はすべて正常に動作しています。我々は再びメソッドを呼び出した場合

Answer 1

しかし、値が変化しなかった

public showUserReferencesModal() 
{ 
    this.showUserReferences = !this.showUserReferences; 
} 

ORただ、

を（あなたは showUserReferencesModalメソッドを呼び出すにしたくない場合）

(click)="showUserReferences = !showUserReferences" 

Answer 2

方法を使用せずに行うことができます：

ここで注目すべき

<div> 
    <references-modal *ngIf="showUserReferences"></references-modal> 

    <button class="basic-link" (click)="showUserReferences = !showUserReferences"> 
     <small>Références</small> 
    </button> 
</div> 

Answer 3

いくつかのポイント： -

• 指令に、NgIfを追加する必要はありません。それは@gunter

• ここ* ngIfでtrueをチェックする必要はありませんで言ったように、これはすでにtrue/falseを受け入れるため、デフォルトでは世界的に利用可能であるかCORE_DIRECTIVESの一部です。

*ngIf="showUserReferences" 

代わりに、単に値を切り替えるためのメソッドを呼び出すの

• はあなたが

(click)="showUserReferences = !showUserReferences"