Home Angular 2 : How to pass function into child component
Reply: 0

Angular 2 : How to pass function into child component

user1401
1#
user1401 Published in June 25, 2018, 7:13 pm

In an Angular 2 app, say i have a 'SaveComponent' where clicking its save button calls a function isDirty() that returns true or false (true if the content of the parent component has been modified). Note the reason for the 'SaveComponent' is that it has styles and other 'widgets' associated with it that are shared among many components.

currently there is a isDirty function defined in each of the parent components, and the function is passed to SaveComponent as follows inside the parent template:

<save-component [isDirty]="isDirty"> </save-component>

if you care to see, a simplified version of SaveComponent is defined something like this...

import {Component, Input} from 'angular2/core';

@Component({
  selector: 'save-component',
  templateUrl: 'who-cares-to-know.component.html'
})

export class SaveComponent {
  @Input() isDirty;
}

It works only initially. It seems that the isDirty function only returns false (or only called once?) even when the content is modified. Note that the function does work correctly when it's called from the parent component.

What's wrong? Is it possible to pass function from parent to child component via @Input or some other means? Thanks!

You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.329206 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO