使用@output将角度从子组件发送到父组件

Question

I have some data that I am passing from my child to parent component and I want it to check if its empty or it has some value inside automatically.

this is in my login.compunent.ts - child ts

@Output() update=new EventEmitter<string>();
userEmail = "a@b.com";
authUser(loginForm) {      
      this.update.emit(userEmail);
      this.router.navigate(['/home']);
  }

this is in my app.compunent.ts - parent ts

  emailData:string;

  onUpdate(userEmail:string){
    console.log("userEmail")
    if(userEmail !== ''){
      this.emailData = userEmail
      console.log(userEmail)
    }
  }

this is in my app.compunent.html - parernt html

{{emailData}}
<router-outlet (update)="onUpdate($event)"></router-outlet>

Answer 1

I'm not sure I understand you completely but if you want to pass data from your child to your parent "automatically" I believe you have to implement a two-way bindable property.

You do that like this

child.ts

export class SomeComponent  {
  ...
     @Input() something;
     // it's important to name it with the 'Change' suffix 
     @Output() somethingChange = new EventEmitter();
  ...

parent.html

<some-component [(something)] = "someFieldYouWantToTwoWayBindTo"></some-component>

now whenever you update something from your child the field someFieldYouWantToTwoWayBindTo will also be updated

Now if you want to check what's in something and only filter certain cases then implement a setter for someFieldYouWantToTwoWayBindTo

parent.ts

_someFieldYouWantToTwoWayBindTo
set someFieldYouWantToTwoWayBindTo(value) {
    if(value !== '')
      this._someFieldYouWantToTwoWayBindTo = value;

}