title: input and output for the same variable
body: <p>I have a variable that can be edited from parent and for child.</p>
  
  <p>parent.html:</p>
  
  <pre><code> &lt;div *ngIf="editEnabled"&gt;
    &lt;mat-icon (click)="disableEdit()"&gt;cancel&lt;/mat-icon&gt;
  &lt;/div&gt;
  
  &lt;child [(editEnabled)]="editEnabled"&gt;&lt;/child&gt;
  </code></pre>
  
  <p>parent.ts:</p>
  
  <pre><code>export class ParentComponent {
  
     editEnabled: boolean;
  
     disableEdit(){
       this.editEnabled = false;
     }
  }
  </code></pre>
  
  <p>Child.html:</p>
  
  <pre><code> &lt;div *ngIf="!editEnabled"&gt;
    &lt;mat-icon (click)="enableEdit()"&gt;settings&lt;/mat-icon&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>child.ts</p>
  
  <pre><code>private _editEnabled: boolean;
  
  @Input()
   set editEnabled(value: boolean) {
    this._editEnabled = value;
  
  }
  get editEnabled(): boolean {
   return this._editEnabled;
  }
  
  enableEdit(){
       this.editEnabled = true;
  }
  </code></pre>
  
  <p>But I cant comunicate editEnabled between the two components. </p>
  
  <p>Where is my mistake?</p>