AngularJS NgOnInItメソッドルータリンクを使用してコンポーネントへの2回目の訪問でデータを失う

Question

私はコンポーネントを編集スクリムと呼ばれ、コンポーネントの中に2つのタイプのモデル「チーム」の配列があります。私は配列に値を割り当てるためにコンポーネントにインポートしました。ページへの私の最初の訪問では、配列はちゃんと埋まっていますが、router.navigate（）を使って別のページに行き、routerlinkを使って "edit-scrim"にカムバックすると、配列のうちの1つのデータが失われます。配列にデータを割り当てるための私のすべての機能はngOnInitの内部にあり、このメソッド内でconsole.log（ "check"）を実行して、コンポーネントにアクセスするたびに呼び出されるかどうかを確認しました。IT何が間違っているのか分かりません。

私は私のページを更新した場合、データが戻ってくるが、私は再びrouterlinkを通してそれを訪問するならば、それはcomponent.tsで私の配列は添付

teams: Team[]; 
myTeams: Team[] = []; 

を提出されているわけではない

これらのん私のngOnInItメソッドのコードスニペットです。私はルータリンクを使って別のページを訪問し、 "編集スクリム"に戻り、データはなくなりました。

ngOnInit() { 
console.log("check"); 
this.myinit(); 

} 

myinit() { 



this.authService.getAuth().subscribe(auth => { 
    if (auth) { 
    this.loggedInUser = auth.email; 
    } else { 

    } 
}); 

this.teamService.getTeams().subscribe(teams => { 
    this.teams = teams; 
    console.log(this.teams); 
    for (var i = 0; i < this.teams.length; i++) { 
    if (this.teams[i].createdBy == this.loggedInUser) { 
     this.myTeams.push(this.teams[i]); 
    } 
    } 

}); 

console.log(this.myTeams); 


this.id = this.route.snapshot.params['id']; 

//Get Team 
this.scrimService.getScrim(this.id).subscribe(scrim => { 
    this.scrim = scrim; 
}); 


} 

console.log info after visiting the page twice

EDIT 私は私のinit関数内でこれを行うと、私は別のページに移動しに戻ってきた場合、私は私のページをご覧初めてそれは、正しいデータをconsole.logsこれは失われています。 ：/

this.teamService.getTeams().subscribe(teams => { 
    this.teams = teams; 
    console.log(this.teams); 

    // this.myTeams = this.teams.filter(function (team) { return 
    team.createdBy == this.loggedInUser; }); 
    this.myTeams = this.teams.filter(team => team.createdBy == 
    this.loggedInUser) 
    console.log(this.myTeams); 


    }); 

EDIT2

this.authService.getAuth().subscribe(auth => { 
     if (auth) { 
     this.loggedInUser = auth.email; 
     this.teamService.getTeams().subscribe(teams => { 
     this.teams = teams; 
     console.log(this.teams); 

    //this.myTeams = this.teams.filter(function (team) { return team.createdBy == this.loggedInUser; }); 
    this.myTeams = this.teams.filter(team => team.createdBy == this.loggedInUser) 
    console.log(this.myTeams); 


    }); 
     } else { 

     } 
    }); 

EDIT3 - >このように動作しませんでした：/たぶん私は、構文を台無しに？

this.authService.getAuth().subscribe(auth => { 
     if (auth) { 
     this.loggedInUser = auth.email; 
     } 
    }, 
     error => { console.log(error) }, 
    () => { 
     this.teamService.getTeams().subscribe(teams => { 
      this.teams = teams; 
      this.myTeams = this.teams.filter(team => team.createdBy == this.loggedInUser); 
      console.log(this.teams); 
      console.log(this.myTeams); 
     }); 
     }); 

EDIT 4 - 動作しませんでした、それもにconsole.log

this.authService.getAuth().subscribe(auth => { 
     if (auth) { 
     this.loggedInUser = auth.email; 
     } 
    }, 
     error => { console.log(error) }, 
    () => { 
     this.teamService.getTeams().subscribe(teams => { 
      this.teams = teams; 
      this.myTeams = this.teams.filter(team => team.createdBy == this.loggedInUser); 
      console.log(this.teams); 
      console.log(this.myTeams); 
     }); 
     }); 

Answer 1

を行う段階になっていないあなたのチームのサービスコールは、認証が正常に完了に依存していますサービスコール、それであなたはそれを一緒に "連鎖"する必要があります。それを行うための最も簡単な方法は、コールが正常に実行された場合にのみ実行される最初の購読コードブロック内の2番目の呼び出しを置くことです：

.subscribe(
    function(response) { //code that handles response }, 
    function(error) { // error handling }, 
    function() { // code that runs after completion } 
); 

だからあなたの場合には、あなたがこのようなものがあります：

myinit() { 
    this.authService.getAuth().subscribe((auth) => { 
     if (auth) { 
      this.loggedInUser = auth.email; 
     } 
    }, 
    (error) => { console.log(error); }, 
    () => { 
      this.teamService.getTeams().subscribe(teams => { 
      this.teams = teams; 
      this.myTeams = this.teams.filter(team => team.createdBy == this.loggedInUser); 
    }); 
}); 
} 

を