cambie el elemento contenteditable a verdadero con la llamada de botón para editar el texto del elemento y al desdibujar cambie el elemento contenteditable a falso cuando termine de editar.
¡cómo establecer contenteditable en falso en la clase!
import {Component} from 'angular2/core' @Component({ selector: 'my-app', template: ` <h2 #el contenteditable="false" (blur)="text=el.textContent"> This Content is Editable </h2> <button (click)="toggleContenteditable()">Edit Text Content</button> <hr/> <p> Text Obj: {{text}}</p> ` }) export class App { text : string; contenteditable:bool = false; toggleContenteditable(){ this.contenteditable = !this.contenteditable; } }Debe usar el enlace de propiedad con attr. prefijo antes de contenteditable y luego pase la variable contenteditable allí. Esto lo ayudaría a realizar el efecto de alternar en contenteditable a través del método toggleContenteditable .
<h2 #el [attr.contenteditable]="contenteditable" (blur)="text=el.textContent"> También cambie la función toggleContenteditable a continuación.
toggleContenteditable(){ this.contenteditable = !this.contenteditable; //`this.` was missing in later assignment }