要在Angular 8中实现这个功能，你需要进行以下步骤：

1. 创建一个登录表单组件，其中包含一个输入框和一个登录按钮。在用户输入用户名后，将其存储在组件的属性中。

// login.component.html

Login

// login.component.ts
import { Component } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent {
  username: string;

  constructor(private router: Router) {}

  login() {
    // 导航到下一个页面，并将用户名作为参数传递
    this.router.navigate(['/next'], { queryParams: { username: this.username } });
  }
}

2. 创建一个导航栏组件，在其中显示用户名。可以使用Angular的ActivatedRoute服务来获取URL参数，并订阅参数的变化。

// navbar.component.ts
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Component({
  selector: 'app-navbar',
  templateUrl: './navbar.component.html',
  styleUrls: ['./navbar.component.css']
})
export class NavbarComponent implements OnInit {
  username: string;

  constructor(private route: ActivatedRoute) {}

  ngOnInit() {
    // 订阅URL参数的变化
    this.route.queryParams.subscribe(params => {
      this.username = params.username;
    });
  }
}

3. 在需要显示导航栏的页面中，将导航栏组件添加到模板中。

这样，在用户点击登录按钮后，会导航到下一个页面，并在导航栏组件中显示用户名。