Styjun

What's the best way to quit a job mostly because of money?

What do I need to do, tax-wise, for a sudden windfall?

Prove that the infinite series equals 1

Labels still showing when no Label Features turned on in ArcMap?

Create a cube from identical 3D objects

Recording Spectral Lines at Home

If the pressure inside and outside a balloon balance, then why does air leave when it pops?

Mathematica 12 has gotten worse at solving simple equations?

Is all-caps blackletter no longer taboo?

Why do (or did, until very recently) aircraft transponders wait to be interrogated before broadcasting beacon signals?

Am I allowed to determine tenets of my contract as a warlock?

In The Incredibles 2, why does Screenslaver's name use a pun on something that doesn't exist in the 1950s pastiche?

What exactly "triggers an additional time" in the interaction between Afterlife and Teysa Karlov?

In American Politics, why is the Justice Department under the President?

What is this object?

How many sets of dice do I need for D&D?

Grandpa has another non math question

A life of PhD: is it feasible?

How to make a composition of functions prettier?

Part of my house is inexplicably gone

Why did Robert pick unworthy men for the White Cloaks?

Oil draining out shortly after turbo hose detached/broke

How can I list the different hex characters between two files?

As easy as Three, Two, One... How fast can you go from Five to Four?

Angular Child component not emitting result to Parent

Angular 2 ngModel in child component updates parent component propertyHow to detect when an @Input() value changes in Angular?Angular2, child output not bubbling up to parentangular 2 parent and child detect changes hierarchyAngular 2 - send data from Child to Parent componentAccessing child component value in Parent componentEmitting an array using EventEmitter showing undefinedAngular 6.1.1 - EventEmitter doesn't emit to parent componentStrange behaviour of event emitted by child component to parent componentEventemitter would not emit the data from child to parent component

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty height:90px;width:728px;box-sizing:border-box;

-1

I am trying to emit a child component value, but I'm confused how to pass the selection from the child to the parent. The child works fine, but no data is being passed to the parent. As I understand it I don't need to declare an event emitter- just use the @Output() annotation. Is that not correct?

WORKS (I can see the lgselected property change):

Child HTML:

lgselected.shortName
<mat-form-field>
 <mat-select [(ngModel)]="lgselected">
 <mat-option *ngFor="let s of lglist$" [value]="s">s.shortName</mat-option>
 </mat-select>
</mat-form-field>

Child TS

lgselected: LicenseGroup;

DOESNT WORK (no console output when I change the child):

parent html:

<lgselector (lgselected)="lg"></lgselector>

parent component:

@Input() set lg(lg: LicenseGroup) 
 this._lg = lg;
 console.log('lg updated: ' + this._lg.id)

angular

share|improve this question

asked Mar 24 at 23:09

Rilcon42Rilcon42

2,84983577

add a comment | 

-1

I am trying to emit a child component value, but I'm confused how to pass the selection from the child to the parent. The child works fine, but no data is being passed to the parent. As I understand it I don't need to declare an event emitter- just use the @Output() annotation. Is that not correct?

WORKS (I can see the lgselected property change):

Child HTML:

lgselected.shortName
<mat-form-field>
 <mat-select [(ngModel)]="lgselected">
 <mat-option *ngFor="let s of lglist$" [value]="s">s.shortName</mat-option>
 </mat-select>
</mat-form-field>

Child TS

lgselected: LicenseGroup;

DOESNT WORK (no console output when I change the child):

parent html:

<lgselector (lgselected)="lg"></lgselector>

parent component:

@Input() set lg(lg: LicenseGroup) 
 this._lg = lg;
 console.log('lg updated: ' + this._lg.id)

angular

share|improve this question

asked Mar 24 at 23:09

Rilcon42Rilcon42

2,84983577

add a comment | 

I am trying to emit a child component value, but I'm confused how to pass the selection from the child to the parent. The child works fine, but no data is being passed to the parent. As I understand it I don't need to declare an event emitter- just use the @Output() annotation. Is that not correct?

WORKS (I can see the lgselected property change):

Child HTML:

lgselected.shortName
<mat-form-field>
 <mat-select [(ngModel)]="lgselected">
 <mat-option *ngFor="let s of lglist$" [value]="s">s.shortName</mat-option>
 </mat-select>
</mat-form-field>

Child TS

lgselected: LicenseGroup;

DOESNT WORK (no console output when I change the child):

parent html:

<lgselector (lgselected)="lg"></lgselector>

parent component:

@Input() set lg(lg: LicenseGroup) 
 this._lg = lg;
 console.log('lg updated: ' + this._lg.id)

angular

share|improve this question

asked Mar 24 at 23:09

Rilcon42Rilcon42

2,84983577

lgselected.shortName
<mat-form-field>
 <mat-select [(ngModel)]="lgselected">
 <mat-option *ngFor="let s of lglist$" [value]="s">s.shortName</mat-option>
 </mat-select>
</mat-form-field>

lgselected: LicenseGroup;

<lgselector (lgselected)="lg"></lgselector>

@Input() set lg(lg: LicenseGroup) 
 this._lg = lg;
 console.log('lg updated: ' + this._lg.id)

angular

angular

share|improve this question

asked Mar 24 at 23:09

Rilcon42Rilcon42

2,84983577

share|improve this question

asked Mar 24 at 23:09

Rilcon42Rilcon42

2,84983577

asked Mar 24 at 23:09

Rilcon42Rilcon42

2,84983577

asked Mar 24 at 23:09

Rilcon42Rilcon42

2,84983577

1 Answer
1

active

oldest

votes

1

Child component

First of all you need to set lgselected as @Output() and EventEmmiter()

@Output() lgselected = new EventEmmiter();

Then you need to emit value on (changes)

So you will add it to the mat-select

<mat-select (change)="change($event)">

Then you can set up the change method in child component

change(event) 
 console.log(event);
 lgselected.emit(event);

Parent component

In parent component just call method on emit

<lgselector (lgselected)="somethingChanged($event)"></lgselector>

Create this method in *.component.ts

somethingChanged(event) 
 console.log(event);

You don't need @Input() here.

For better understanding of components interaction take a look here

share|improve this answer

edited Mar 25 at 14:23

answered Mar 24 at 23:19

Josef KatičJosef Katič

1,2381516

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Does this actually work? Does LicenseGroup need to have an emit function on it? Does this compile?
  
  – R. Richards
  Mar 24 at 23:35
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Answer updated.
  
  – Josef Katič
  Mar 25 at 14:24
  

  
  
  
  

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55329462%2fangular-child-component-not-emitting-result-to-parent%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

1

Child component

First of all you need to set lgselected as @Output() and EventEmmiter()

@Output() lgselected = new EventEmmiter();

Then you need to emit value on (changes)

So you will add it to the mat-select

<mat-select (change)="change($event)">

Then you can set up the change method in child component

change(event) 
 console.log(event);
 lgselected.emit(event);

Parent component

In parent component just call method on emit

<lgselector (lgselected)="somethingChanged($event)"></lgselector>

Create this method in *.component.ts

somethingChanged(event) 
 console.log(event);

You don't need @Input() here.

For better understanding of components interaction take a look here

share|improve this answer

edited Mar 25 at 14:23

answered Mar 24 at 23:19

Josef KatičJosef Katič

1,2381516

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Does this actually work? Does LicenseGroup need to have an emit function on it? Does this compile?
  
  – R. Richards
  Mar 24 at 23:35
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Answer updated.
  
  – Josef Katič
  Mar 25 at 14:24
  

  
  
  
  

add a comment | 

1

Child component

First of all you need to set lgselected as @Output() and EventEmmiter()

@Output() lgselected = new EventEmmiter();

Then you need to emit value on (changes)

So you will add it to the mat-select

<mat-select (change)="change($event)">

Then you can set up the change method in child component

change(event) 
 console.log(event);
 lgselected.emit(event);

Parent component

In parent component just call method on emit

<lgselector (lgselected)="somethingChanged($event)"></lgselector>

Create this method in *.component.ts

somethingChanged(event) 
 console.log(event);

You don't need @Input() here.

For better understanding of components interaction take a look here

share|improve this answer

edited Mar 25 at 14:23

answered Mar 24 at 23:19

Josef KatičJosef Katič

1,2381516

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Does this actually work? Does LicenseGroup need to have an emit function on it? Does this compile?
  
  – R. Richards
  Mar 24 at 23:35
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Answer updated.
  
  – Josef Katič
  Mar 25 at 14:24
  

  
  
  
  

add a comment | 

Child component

First of all you need to set lgselected as @Output() and EventEmmiter()

@Output() lgselected = new EventEmmiter();

Then you need to emit value on (changes)

So you will add it to the mat-select

<mat-select (change)="change($event)">

Then you can set up the change method in child component

change(event) 
 console.log(event);
 lgselected.emit(event);

Parent component

In parent component just call method on emit

<lgselector (lgselected)="somethingChanged($event)"></lgselector>

Create this method in *.component.ts

somethingChanged(event) 
 console.log(event);

You don't need @Input() here.

For better understanding of components interaction take a look here

share|improve this answer

edited Mar 25 at 14:23

answered Mar 24 at 23:19

Josef KatičJosef Katič

1,2381516

@Output() lgselected = new EventEmmiter();

<mat-select (change)="change($event)">

change(event) 
 console.log(event);
 lgselected.emit(event);

<lgselector (lgselected)="somethingChanged($event)"></lgselector>

somethingChanged(event) 
 console.log(event);

share|improve this answer

edited Mar 25 at 14:23

answered Mar 24 at 23:19

Josef KatičJosef Katič

1,2381516

answered Mar 24 at 23:19

Josef KatičJosef Katič

1,2381516

answered Mar 24 at 23:19

Josef KatičJosef Katič

1,2381516