How to get or set attributes of ionic-components from TS file?

I wanted to know how can We get or set a particular property or attribute of ionic component from TypeScript file.

Suppose I have a input component on my HTML page:

    <ion-input type="text" [(ngModel)]="testText"></ion-input>

How can I get or set its particular attribute such as max,min,placeholder or make it readonly from TS file. Can we access properties from ngModel value? Let say I have Date component on my page:

    <ion-datetime  pickerFormat="MMMM YYYY" [(ngModel)]="myDate"></ion-datetime>

How can we set its attributes(such as Min date,Max date) from TS file?

1 Like

angular use a specific syntax to communicate bettwenn html and ts side. Look for example here section template syntax.

in short
[property] = mybindproperty
(event) = mybindevent()
[[input)] = mytwowayinputbinding

Best regards, anna-liebt

Thank You very much for your answer. In my question suppose I have to set Min attribute to ion-Date time from TS file. Will I do it like this:



ahmm, no. I am not sure what…

If you look to the doc of ion-date, then you will find this.

  <ion-datetime displayFormat="MMMM YYYY" min="2016" max="2020-10-31" [(ngModel)]="myDate">

is bound in twowaystyle to the variable myDate in ts. Here is where the input happens


the attribute min got the string “2016” inside html, because it is not bound with [] to ts side.


[min] is bound, you see it on the square brackets, to luzifers …, ähh, a variable called endofworld in ts.

If you wanna bind an event, maybe (click) to call a method, then you will do

<button (click)="AnyMethod()"></button>

In this case your are … and can call then end of the world by your self.

Best regards, anna-liebt.

BTW the cheat sheet is really good. Read it and related docs.

Thank you @anna_liebt . You have cleared my doubt.

one another thing I saw on your code. Never use any in declaration as long is not a must. Things are so much easier with a proper declaration.

Best regrards, anna-liebt

Sure. I will take care of that onward.