Question

我的角度项目中几乎没有内容。子路径将这些组件呈现为一个特殊的组件。当我单击以进行路由时，第一次渲染组件。但是之后，它只会更改url参数，而不呈现任何组件。

这是我的代码，

course.component.html

<div *ngIf="courses">
  <a *ngFor="let course of courses" class="btn btn-danger" color="warn" routerLink="{{ course.id }}">{{ course.title }}</a>
</div>

course.component.ts

segmentId: Object;
courses: Object;
meta_data: any;
showSpinner: boolean = true;

constructor(private route: ActivatedRoute, private data: DataService, private seo: SeoService) {

}

ngOnInit() {
    this.segmentId = this.route.snapshot.params['segment'];
    this.route.params.subscribe((params: Params) => {
        this.segmentId = params.segment
    });

    this.data.getCourses(this.segmentId).subscribe(data => {
        this.courses = data[0].courses;

        this.meta_data = data[0];

        this.showSpinner = false;

        //console.log( this.courses )
        //console.log( this.meta_data.segmentName )
    })
}

Answer 1

每个组件实例仅调用一次

ngOnInit。因此，这是正常的行为。

如果要实时更改，则需要使用可观察的方式，例如：

ngOnInit() {
  this.route.paramMap.pipe(
    switchMap(params => {
      this.segmentId = params.get('segment');
      return this.data.getCourses(this.segmentId);
    })
  ).subscribe(
    data => {
      this.courses = data[0].courses;
      this.meta_data = data[0];
      this.showSpinner = false;
    }
  )
}

为什么有角度的子路线没有渲染组件，除了第一次？

1 个答案: