Trying to write (change/input) event in wrapper component

[Ketan Patel]

I have created a wrapper component around ejs-textbox. I want to call change/input events from wrapper component.

Something like 

<text-wrapper (change)="onChange($event)></text-wrapper>

[Sureshkumar P]

Hi Ketan,

We have created the sample based on your requirement. Find the code example here:

[original component]

[component.html]

<div class="col-lg-8 control-section multiline">

  <ejs-textbox id="textarea" #default placeholder="Enter your address" floatLabelType="Auto" required

    (change)="componentChange($event)"></ejs-textbox>

</div>

[component.ts]

@Component({

  selector: 'text-wrapper',

  templateUrl: 'textwrapper.component.html',

})

export class TextWrapper {

  @Input() text: string;

  @Output() change = new EventEmitter();

 

  componentChange(args) {

    this.change.next(args);

  }

}

 

[custom component]

[component.html]

<div class="col-lg-8 control-section multiline">

<text-wrapper #textwrapper (change)="onChange($event)"></text-wrapper>

</div>

[component.ts]

export class AppComponent {

  onChange(args) {

    console.log('change event: ' + args);

  }

}

 

Find the sample here: https://stackblitz.com/edit/angular-bb6swk?file=app.component.html

Regards,

Sureshkumar P

[Ketan Patel]

Thank you Sureshkumar! This helpes.

[Sureshkumar P]

Ketan,

Thanks for your update.

Regards,

Sureshkumar P