Block and unblock the lable to edit by clicking


I want something like as above shown image. When I click on the edit button then I should able to edit the label( A little about you label ) how can I do it.

You can use [Disabled =“condition”] to make it

[Disabled]="condition" It is saying as

Can’t bind to ‘Disabled’ since it isn’t a known property of ‘p’. ("

Can you share your code please ?

      <button ion-button clear item-end style="font-size:11px;color: #3BABE3;font-weight:bold;">Edit
        <ion-icon name="ios-arrow-forward" class="arrow"></ion-icon>

      <ion-item class="items">
        <p style="color:grey;font-size:11px;">A little about you</p>


You can’t edit labels, so doing exactly what you describe is impossible. What you can do is to make your <p> an <ion-input> and either disable it when it’s not editable or swap it with structural directives for an actual label if you like the styling better in that case.