更改路由每次都在同一组件上调用ngOniinit

Question

我是个新人，并尝试学习角度。我正在尝试制作博客应用，但我遇到了问题在我的博客应用中，我有Myposts部分，其中有三个链接所以我的网址看起来像http://localhost:4200/myposts/all（默认情况下）http://localhost:4200/myposts/publichttp://localhost:4200/myposts/private

1-全部帖子2.公共职位3个私人帖子

但是当我单击任何链接时，它无法按预期方式工作。有时，即使我单击私有帖子，也会调用公共发布方法。它存在一些冲突，并且活动类也不起作用。另外我注意到在同一页面上更改路由器时，每次都会调用ngOninit方法这是我的代码。

mypost.html

 <div class="list-group">
            <a class=" list-group-item " [routerLink]="['../all']" [ngClass]="{'active': isAll == true }" (click)="getAllPosts() ">All Posts</a>

            <a class="list-group-item " [routerLink]="['../public']" [ngClass]="{'active': isPublic==true }" (click)="getPublicPosts() ">Public Posts</a>

            <a class="list-group-item " [routerLink]="['../private']" [ngClass]="{'active': isPrivate== true }" (click)="getPriavtePosts() ">Private Posts</a>
        </div>

mypost.ts

  ngOnInit(): void {
  //  this.acrud.getAllPost();
  /*   this.getPublicPosts();
    this.getPriavtePosts();
    this.getAllPosts(); */
  }

  getPublicPosts() {
    console.log("public post")
    this.isAll = false;
    this.isPublic = true;
    this.isPrivate = false;
    this.isFetching = true;
    this.acrud.getPublicPost()
      .pipe(
        map(responseData => {
          const postsArray: UPost[] = [];
          for (const key in responseData) {
            if (responseData.hasOwnProperty(key)) {
              postsArray.push({ ...responseData[key] });
            }
          }
          return postsArray;
        })
      )
      .subscribe(posts => {
        this.isFetching = false;
        this.public_post = posts;
        this.allpost = this.allpost.concat(this.public_post)
        console.log(this.public_post)
        console.log(this.isAll,this.isPrivate,this.isPublic)
      });


  }
  getPriavtePosts() {
    console.log("priiate post")
    this.isAll = false;
    this.isPublic = false;
    this.isPrivate = true;
    this.isFetching = true;
    this.acrud.getPrivatePost()
      .pipe(
        map(responseData => {
          const postsArray: UPost[] = [];
          for (const key in responseData) {
            if (responseData.hasOwnProperty(key)) {
              postsArray.push({ ...responseData[key] });
            }
          }
          return postsArray;
        })
      )
      .subscribe(posts => {
        this.isFetching = false;
        this.private_post = posts;
        this.allpost = this.allpost.concat(this.private_post)

        console.log(this.private_post)
        console.log(this.isAll,this.isPrivate,this.isPublic)
      });

  }
  getAllPosts() {
   console.log("all post")
    this.isAll = true;
    this.isPublic = false;
    this.isPrivate = false;
    this.allpost = this.private_post.concat(this.public_post)
    this.acrud.sortDesecending(this.allpost)
    console.log(this.allpost)
    console.log(this.isAll,this.isPrivate,this.isPublic)
  }

crud.service.ts

 getPublicPost(): Observable<UPost[]>{
    return this.http.get<UPost[]>(`https://write-your-heart-out-b338b.firebaseio.com/post/${this.uid}/public.json`)

  }

  getPrivatePost(): Observable<UPost[]>{
    return this.http.get<UPost[]>(`https://write-your-heart-out-b338b.firebaseio.com/post/${this.uid}/private.json`)

  }

app-routing.module.ts

const routes: Routes = [
  { path: '', redirectTo: '/home', pathMatch: 'full' },
  { path: 'home', component: HomeComponent },
  { path: 'home/:id', component: UPostDetailComponent },
  { path: 'create-post', component: UCreatePostComponent },
  { path: 'auth', component: AuthComponentComponent },
  { path: 'myposts', component: MyPostsComponent },

  { path: 'myposts/all', component: MyPostsComponent,pathMatch: 'full'  },
  { path: 'myposts/private', component: MyPostsComponent,pathMatch: 'full'  },
  { path: 'myposts/public', component: MyPostsComponent,pathMatch: 'full'  },

  { path: 'myposts/all/:id', component: UPostDetailComponent },
  { path: 'myposts/public/:id', component: UPostDetailComponent },
  { path: 'myposts/private/:id', component: UPostDetailComponent },
];

Answer 1

我只是想确认您提供的代码块是整个文件，并且您还没有忘记使用提供的角度装饰器吗？

如果您不知道我在说什么，我很乐于阐述，如果没有完整的文件，我将无法完全重现您的错误。