ionic-framework icon indicating copy to clipboard operation
ionic-framework copied to clipboard

feat: Angular - make certain inputs `booleanAttribute`s

Open ntorrey opened this issue 1 week ago • 0 comments

Prerequisites

Describe the Feature Request

This issue was brought up as a bug 5 years ago in #21638, but I'm making it a feature request. My editor complains when I don't specify the value of certain valid ionic attributes:

<ion-item button detail/>
          ~~~~~~  ~~~~~

The error is: TS2322: Type string is not assignable to type boolean It compiles fine and works in my app, but in order to get rid of the complaints of my IDE, I have to specify the values of these attributes as true:

<ion-item [button]="true" [detail]="true"/>

Describe the Use Case

Make these errors go away, and make this approach work! It looks much cleaner.

<ion-item button detail/>

Describe Preferred Solution

Coerce the value of these attributes to booleans:

  // Using `coerceBooleanProperty` allows for the disabled value of a button to be set as
  // `<my-button disabled></my-button>` instead of `<my-button [disabled]="true"></my-button>`.
  // It also allows for a string to be passed like `<my-button disabled="true"></my-button>`.
  @Input()
  get button() { return this._button; }
  set button(value: BooleanInput) {
    this._button = coerceBooleanProperty(value);
  }
  private _button = false;

Describe Alternatives

Give the attributes explicit values:

<ion-item [button]="true" [detail]="true"/>

Related Code

No response

Additional Information

No response

ntorrey avatar Dec 01 '25 12:12 ntorrey