передать значение от дочернего (модальный вход) родительскому не работает

Я хочу получить имя пользователя из токена из компонента входа в систему (компонент входа в систему является дочерним элементом компонента панели навигации) и передать его родителю, чтобы показать его в панели навигации, например, привет, ИМЯ ПОЛЬЗОВАТЕЛЯ! .я пробовал это, но я не получаю значения в соответствии с моим кодом huser общедоступная переменная должна иметь значение имени пользователя, но оно пустое и не показывает примечание. Я использую логинкомпонент как модальный

Есть идеи?

<div class="wrapper" (theuser)="getuser($event)">
  <form class="col s12" novalidate #f="ngForm" (submit)="onSubmit(f)">
    <p>ورود کنید</p>
    <div class="">
      <button class="waves-effect waves-light btn-flat red lighten-1 white-text"
              (click)="authenticatea()"><i class="ion-social-googleplus right" style="font-size: 25px"></i>signin
      </button>
      <button class="btn">aaaa</button>
    </div>


    <label for="username">نام کاربری</label>
    <input
      type="text"
      id="username"
      class="validate"
      placeholder="username"
      required
      autofocus
      [(ngModel)]="user.username"
      name="username"
      #username="ngModel"
      minlength="3"
    >
    <div class="red" *ngIf="username.errors?.required && username.touched">
      username required
    </div>
    <div class="red" *ngIf="username.errors?.minlength && username.touched">
      username must at least 2 character!
    </div>
    <label for="inputPassword">کلمه عبور</label>
    <input
      type="password"
      id="inputPassword"
      class="validate"
      placeholder="Password"
      required
      [(ngModel)]="user.password"
      name="password"
      #password="ngModel"
    >
    <div class="alert alert-danger" *ngIf="password.errors?.required && password.touched">
      password required
    </div>
    <div>
      <mat-checkbox></mat-checkbox>
      <label for="test6">ذخیره اطلاعات ورودی</label>
    </div>
    <div class="red-text" *ngIf="error"><p style="font-weight: bold;">{{ error }}</p></div>
    <br>
    <div>
      <button mat-raised-button color="accent" type="submit">ورود</button>

    </div>
  </form>
</div>

это ts-файл компонента входа в систему

export class LoginComponent implements OnInit {


  public user = {
    username: '',
    password: ''
  };

  public error;

  @Output() theuser = new EventEmitter();

  constructor(private http: HttpClient,
              private router: Router,
              public dialogRef: MatDialogRef<LoginComponent>) {

  }


  ngOnInit() {
  }

  onSubmit({value, valid}) {
    if (!valid) {
      console.log("form in invalid!");
    }
    let username = value.username;
    let password = value.password;

    this.http.post<any>("http://localhost:8000/login/", {username: username, password: password})
      .subscribe(
        user => {
          console.log(user);
          if (user && user.token) {
            localStorage.setItem('token', JSON.stringify(user.token));
            const token = localStorage.getItem('token');

            let payload = decode(token);

            this.theuser.emit(payload.username);
            this.dialogRef.close();
            this.router.navigate(['/']);
          }
        }, err => {
          this.error = err.error.non_field_errors;
        }
      );
  }
}

мой файл компонента навигационной панели (родитель логина):

export class NavbarComponent implements OnInit, OnChanges {


  public huser;
  public user = {
    username: ''
  };

  constructor(private http: AuthUserService,
              private userInfoHttp: HttpClient,
              private  router: Router,
              public modal: MatDialog) {


  }


  openLoginModal() {
    let dialogRef = this.modal.open(LoginComponent, {
      height: '400px',
      width: '600px',
    });

  }

  isAuthenticated(): boolean {
    return this.http.isAuthenticated()

  }


  ngOnInit() {

  }

  ngOnChanges() {

  }

  logout() {
    this.http.logout();
    this.router.navigate(['/']);

  }



 getuser(event) {
    this.huser =  event
  }

}