We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Add Button to textboxComponent wont work. Function AddIcon undefined

Hi.

I wanted to add a button to my textbox component just as in your example from https://ej2.syncfusion.com/angular/documentation/textbox/style-appearance/

If i try to do this i got an error with the function addIcon. Can you please help me what i am doing wrong. 

See my example on Stackblitz. https://stackblitz.com/edit/angular-r6gsy9?file=src/app/app.component.ts


Regards 



5 Replies

UD UdhayaKumar Duraisamy Syncfusion Team November 10, 2022 12:18 AM



MW Matthias Wagner November 10, 2022 04:21 AM

Hi, thanks for your fast answer.


I copied this example from your website, but i always get the error that 

"property addIcon does not exist on type TextBoxComponent"


Do i miss some references? See my example on Stackblitz https://stackblitz.com/edit/angular-ivy-huyumt?file=src/app/app.component.ts



VY Vinothkumar Yuvaraj Syncfusion Team November 11, 2022 09:50 AM

Hi Matthias Wagner,


We suggest using type any for textboxobj to solve your problem. Please find the below code and sample for your reference.


App.component.ts

export class AppComponent {

  public onCreate(argsany): void {

    (this.textboxObj as any).addIcon('append''e-icons e-search');

  }

}


Sample : https://stackblitz.com/edit/angular-ivy-hh9yev?file=src%2Fapp%2Fapp.component.ts


If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.



MW Matthias Wagner November 22, 2022 05:57 AM

Hello,


i just noticed, that the addicon function is not the problem.

In my program the ejs-textbox is inside a ng-template block. When i want to add the buttons with the addIcon-Function the ViewChild is always undefined at this moment.


Is there a way to add icons to a ejs-textbox if it is inside a ng-template block?


Regards



UD UdhayaKumar Duraisamy Syncfusion Team November 23, 2022 07:57 AM

If you use ejs-textbox within a ng-template, you must set ngIf to true to render the component. For more information, please see the shared public blog and code snippet below.


<ng-template ngIf="true">

  <ejs-textbox

    id="textbox"

    #default

    placeholder="Enter your name"

    floatLabelType="Auto"

    (created)="onCreate($event)"

  >

  </ejs-textbox>

</ng-template>


Public blog : https://angular.io/api/core/ng-template#description


Loader.
Live Chat Icon For mobile
Up arrow icon