Block and unblock the lable to edit by clicking


#1

rt

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.


#2

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


#3

[Disabled]="condition" It is saying as

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


#4

Can you share your code please ?


#5
<ion-item-divider>
      <ion-label>Summary</ion-label>
      <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>
      </button>
  </ion-item-divider>

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

      </ion-item>

#6

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.