2017-06-13 4 views
2

ボタンのクリックで角度2を使用してタグの無効属性を変更しようとしています。これまでは一度無効にすることはできますが、この機能は前後に機能します。角2を使用してボタンクリックで入力タグの無効属性を変更する方法

これは自分のHTMLテンプレートのコードです。

<div *ngIf = "hero"> 
      <h2> {{hero.name}} details! </h2> 
      <button (click)="goBack()">Back </button> 
      <button (click)="edit()"> Edit </button> 
      <button (click)="save()">Save </button> 
      <div><label> Id: </label> {{hero.id}} </div> 
      <div> 
       <label> Name: </label> 
       <input [(ngModel)] = "hero.name" placeholder = "name" 
       [disabled]="change" /> 
      </div> 

     </div> 

これはこれは私が現在、私のプロパティの値が変更されて表示するconsole.logsを持っているもののブラウザで私のコンポーネントからの私のコード

hero: Hero; 
editOn: boolean = true; 
change: string;  
edit(): string 

{ 

if(this.editOn) 
{ 
    this.editOn = false; 
    this.change = "abled"; 
    console.log("Change propery status: ", this.change); 
    return this.change; 

}else if (!this.editOn) 
{ 
    this.editOn = true; 
    this.change = "disabled"; 
    console.log("Change propery status: ", this.change); 
    return this.change; 

} 

です。 Broswer Image

答えて

1

[disabled]指示の右側はbooleanの値である必要があります。 "disabled""abled"は真実の値です。したがって、それは[disabled]="true"

例に評価されます。

if(this.editOn) 
{ 
    this.editOn = false; 
    this.change = false; 
    console.log("Change propery status: ", this.change); 
    return this.change; 

}else if (!this.editOn) 
{ 
    this.editOn = true; 
    this.change = true; 
    console.log("Change propery status: ", this.change); 
    return this.change; 

} 
+0

ソリューションのためにありがとうございました!これは多くの助けになりました! –

+0

@EdwardMuldrew喜んで私は助けることができます:-) – echonax

関連する問題