Question

我的导航栏遇到了这些问题，找不到我做错了什么。刚开始，我只是取出了切换代码，“关于”页面的链接就应该放在其中。在我的导航栏的右侧。现在我需要汉堡包导航菜单，因此我必须添加切换代码，但是到“关于”页面的链接完全消失，也没有切换。第二个问题是徽标左侧的小条的外观。

页面截图：

Screenshot of the page

我的代码：

<!DOCTYPE html>
<html>

<head>
  <title>Saasapp</title>
  <%= csrf_meta_tags %>
    <%= csp_meta_tag %>
      <link href="https://fonts.googleapis.com/css? 
    family=Open+Sans:400,700,800" rel="stylesheet">
      <%= stylesheet_link_tag 'application', media: 'all', 'data- 
    turbolinks-track': 'reload' %>
        <%= javascript_pack_tag 'application', 'data-turbolinks-track': 
    'reload' %>
</head>

<body>
  <nav class="navbar navbar-default navbar-static-top" role="navigation">
    <div class='container'>
      <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbarNav" aria-expanded="false">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
           </button>
        <%= link_to root_path, class: "navbar-brand" do %>
          <i class="fas fa-users"></i> DevMatch
          <% end %>
      </div>
      <div class="collapse navbar-collapse navbar-right" id="navbarNav">
        <ul class="navbar-nav">
          <li>
            <%= link_to "About", about_path, id: 
                    "navbar-right" %>
          </li>
        </ul>
      </div>
      <!-- /.navbar-collapse -->
    </div>
  </nav>
  <%= yield %>
</body>

</html>

Answer 1

 get$: Observable<Test>;
 private testSubject = new AsyncSubject<Test>()

  constructor(private readonly http: HttpClient, logger: Logger) {
    this.get$ = this.testSubject.asObservable();
  }

  async validation(obj: Test) {
    const validationResult = await validate(obj);
    // this row the coverage is skipped but the debugger not  
    if (validationResult.length > 0) { 
      throw new Error('error');

    } else {
     //do smth without return
    }
  }

  async loadTest() {
    if (this.flag) {
      return;
    }

    this.flag = true;

    try {
      const testRes = await this.http
        .get<Test>(TestService.apiEndpoint)
        .toPromise();
      const obj = plainToClass(Test, testRes as Object);
      await this.validation(obj);

    } catch (e) {
      this.logger.debug(e.message);
      this.logger.debug('could not fetch test');
    } finally {
      this.testSubject.next(this.test);
      this.testSubject.complete();
    }
  }

应将navbar-right类添加到ul中，而不要添加到div中。

如果您缩小屏幕，则会显示该切换开关。

当添加navbar-toggler时，指向“关于”页面的navbar-right链接会消失。我究竟做错了什么？

1 个答案: