Angular six set initial value for @Output EventEmitter

Question

I have a component

     <p style="padding: 5px">

      <select [(ngModel)]='thisDD' name="nameDD" id="idDD" (ngModelChange)="updateDD(thisDD)" class="form-control">
        <option *ngFor="let thing of thingies" [value]="thing.thingID">{{thing.ThingName}} ({{thing.ThingCode}})</option>
      </select>  

     </p>

Which has an @OutPut

 @Output() selectedValue = new EventEmitter<object>();

And I use this in my app

<my-dropdown (selectedValue)="setValue($event)"></my-dropdown>

Which calls code in the component to "setValue"

setValue(event){
this.currValue=event;
}

This all works great when the value of the drop down is changed but I have other components that rely on a value being set when the application is loaded.

Is there a way to get the value I defaulted my component to through @Output? or how would you accomplish this?

Boubble the event to the other componets with Input/Output if they are sibling, or a service (maybe with a subject) — Vash72, Oct 01 '18 at 20:57
Why can't you emit the default value in the `ngOnInit` method? — Ploppy, Oct 01 '18 at 21:24

score 15 · Accepted Answer · answered Oct 01 '18 at 23:27

15

Simply emit the initial value in ngOnInit

export class YourClass {

    @Output() selectedValue = new EventEmitter<object>();

    ngOnInit() {
        this.selectedValue.emit({{your initial value}});
    }
}

answered Oct 01 '18 at 23:27

Josh Harkema

250
3
11

Angular six set initial value for @Output EventEmitter

1 Answers1

Linked