How to use Ngxmask with EJS TextBox

[David Jones]

I would like to use NGX mask with EJS Textbox but for somereason it doesnt work as it needs input to be a direct child of the ngx mask component.

https://www.npmjs.com/package/ngx-mask

I believe EJS textbox is a wrapper on top of Input so NGX mask doesnt work.

The same also is an issue with ngx google places autocomplete

https://www.npmjs.com/package/@angular-magic/ngx-gp-autocomplete

Is there a way that I can access the actual input of EJS Textbox and assign these pipes to that input?

[Yohapuja Selvakumaran]

Hi David Jones,

Thank you for contacting us. We appreciate your interest in integrating mask support into your Angular app. Instead of using ngx mask, we recommend utilizing our Masked TextBox component, which is specifically designed for this purpose.

To help you get started, we've provided some resources:

Demos: https://ej2.syncfusion.com/angular/demos/#/material3/maskedtextbox/default

Documentation: https://ej2.syncfusion.com/angular/documentation/maskedtextbox/getting-started

Additionally, we've prepared a simple sample demonstrating the implementation of the Masked TextBox:

Sample:
https://stackblitz.com/edit/angular-e1rtlm-u1ywe5?file=src%2Fapp.component.html,src%2Fapp.component.ts

We hope these resources help you achieve your desired functionality seamlessly. If you have any further questions or need assistance, please get back to us.

Regards,

Yohapuja S

[David Jones]

This is good with the masked text box thank you.

The other issue is getting the ejs-textbox to work with ngx-autocomplete . I need to expose the input portion of the ejs-textbox in order to assign this control and have it work. It works fine on a normal input but when using with ejs-textbox it doesn't work

https://www.npmjs.com/package/@angular-magic/ngx-gp-autocomplete

I have created a stackblitz below

https://stackblitz.com/edit/github-tcgghc?file=src%2Fapp.module.ts,src%2Fapp.component.ts,src%2Fmain.ts,package.json

[Yohapuja Selvakumaran]

Hi David Jones,

Thank you for your patience and for providing further details about the integration issue you're experiencing with ejs-textbox and ngx-autocomplete.

We understand the importance of ensuring seamless compatibility between different components in your Angular application. After reviewing your concern and the provided StackBlitz example, we're committed to assisting you in resolving this issue.

To address your specific requirement, we've thoroughly examined your scenario and prepared a sample solution that demonstrates the integration of ngx-autocomplete with ejs-textbox. You can access the sample solution via the following link:

Sample: https://stackblitz.com/edit/github-suhmif-zqznfm?file=src%2Fapp.component.ts,src%2Fapp.module.ts,package.json

We've structured this solution to showcase how you can effectively utilize both ngx-autocomplete and ejs-textbox components together, ensuring they work harmoniously within your Angular project.

Regards,

Yohapuja S

[David Jones]

I see what is happening but this isn't exactly what I was speaking of. I need the selections to show as a list of options as the user types into the input field using ONLY the ejs-textbox control,

Exactly like the attached photo

Attachment: 20240413_101015_8cd94e35.rar

[Yohapuja Selvakumaran]

Hi David Jones,

We apologize for any confusion caused. We'd like to inform you that our autocomplete component resembles a textbox and enables you to perform filtering and list values efficiently. To illustrate its functionality, we've prepared a sample for your reference:

Sample: https://stackblitz.com/edit/angular-t5q4ri?file=src%2Fapp.component.html

For comprehensive insights into the autocomplete component, please refer to the following resources:

Demo: https://ej2.syncfusion.com/angular/demos/#/material3/auto-complete/default

Documentation: https://ej2.syncfusion.com/angular/documentation/introduction

We hope this information helps you achieve your goal. Please get back to us if you need any further assistance.

Regards,

Yohapuja S