ActivatedRoute.routeConfig 为空 - Angular 2 个项目 Angular-cli

Question

我使用 angular-cli 创建了 2 个不同的项目。两者都工作得很好，但其中一个 routeConfig 是 null 并且不知道出了什么问题。

两个文件的 package.json 是相同的，所以对软件包版本没有任何疑问，app.modules 文件也是相同的。

以下是我在两个项目中获得 routeConfig 的方法：

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
  constructor(
    private router: ActivatedRoute
  ) { }

  ngOnInit(): void {
    console.log(this.router.routeConfig);
  }
}

我的实现有什么问题？

Answer 1

经过一番努力并查看我的代码，我发现了这两个应用程序之间的主要区别在于模板部分。

何时工作：home.component.html

<div class="container bg">
  <div class="row">
    <div class="col-lg-3">
      <div class="sidebar">
        <app-sidebar></app-sidebar>
      </div>
    </div>
    <div class="col-lg-9">
      <div class="content-bar">
        <!-- Body -->
        <p>
          home works!
        </p>
        <!-- /body -->
      </div>
    </div>
  </div>
</div>

何时不起作用：app.component.html

<div class="container bg">
  <div class="row">
    <div class="col-lg-3">
      <div class="sidebar">
        <!-- <app-sidebar></app-sidebar> -->
      </div>
    </div>
    <div class="col-lg-9">
      <div class="content-bar">
        <!-- Body -->
        <router-outlet></router-outlet>
        <!-- /body -->
      </div>
    </div>
  </div>
</div>

需要注意的是ActivatedRoute是NULL里面的sidebar.component.ts.

如果回答的不够清楚，欢迎在评论中指出，我会及时更新

更新： 根据的要求，已提供以下解释：

当我在与调用 <router-outlet> 相同的 xxx.component.html 中调用 <app-sidebar> 时，routeConfig 没有获得任何值，因此我按照上述更改了我的代码并且将 <app-sidebar> 移动到 home.component.html 更深的层次，这意味着我必须在每个 xxx.component.html

中调用它

ActivatedRoute.routeConfig 为空 - Angular 2 个项目 Angular-cli

ActivatedRoute.routeConfig is null - Angular 2 project with Angular-cli

javascript

angular

routes

angular-cli

routeconfig