OreoFanatics
OreoFanatics

Reputation: 898

Pass md-input value from dialog to parent component function

I have a md-input field inside of a dialog window (the dialog is a child component). I need to have this value passed as a parameter for a function in the parent component. How to do so?

Upvotes: 0

Views: 183

Answers (1)

FAISAL
FAISAL

Reputation: 34673

Define a shared.service which passes the input value to the parent component:

import {Injectable } from '@angular/core';
import { Subject } from 'rxjs';

@Injectable()
export class SharedService{
   public triggerParentMethod: Subject<string> = new Subject<string>();
}

In your ParentComponent, subscribe to the triggerParentMethod in constructor:

constructor(private sharedService:SharedService,public dialog: MdDialog){
    this.sharedService.triggerParentMethod.subscribe( someValueFromDialog =>{

        // Pass the value to the method here.
        this.someMethod(someValueFromDialog);

      });
}

Bind your <md-input> to some [(ngModule)]:

You can emit that input value from your dialog like this:

this.sharedService.triggerParentMethod.next(this.someField);

Link to working demo.

Upvotes: 1

Related Questions