ヘッダー コンポーネントには、サード パーティの Web サイトにログインするためのログイン ボタンがあります。アプリ sc2 は、ヘッダー コンポーネントで callbackURL を使用して初期化します。ヘッダーで、sc2 への接続に使用される LoginURL を取得しています。loginURL に状態を追加できます。私の場合は、現在表示しているページの ID を含む文字列です。これは、コールバック URL のパラメーターで返されます。問題は、コールバック URL がメイン コンポーネント (ルーター アウトレットにロードされる) を呼び出すため、ヘッダーが状態で更新されないことです。ヘッダー自体はメイン コンポーネントの上にロードされます。メイン コンポーネントを元のコンポーネントに再ルーティングできません。ボタンをメイン コンポーネントからヘッダー コンポーネントに移動する前はすべて機能していましたが、現在はメイン コンポーネントに送信された状態が最後のページに更新されていません。そのため、メイン コンポーネントを介して元のコンポーネントに再ルーティングすることはできません。使用中のページ。messageService と localStorage を試してみましたが、ヘッダー コンポーネントがオンタイムで更新されないようです。コールバック URL は常にメイン コンポーネントです。ヘッダー コンポーネントと直接通信できますか?
app.component
<app-header> </app-header>
<router-outlet> </router-outlet>
this.api = sc2.Initialize({
app: 'someName.app',
// callbackURL: 'http://localhost/main/',
callbackURL: this.callBackURL,
accessToken: this.accessToken,
scope: ['vote', 'comment']
});
this.loginUrl = this.api.getLoginURL(this.state)
page.component.ts
constructor() {
this.newStateService.setState("page")
this.newStateService.setCoinId("pageId")
this.newStateService.changeMessageCoinId(this.coinId)
const params = new HttpParams().set('_id', this.coinId);
}
ヘッダー component.ts
constructor() {
this.newStateService.currentMessageState
.takeWhile(() => this.alive)
.subscribe(message => {
this.state = message
})
this.newStateService.currentMessageCoinId
.takeWhile(() => this.alive)
.subscribe(message => {
this.coinId= message
})
this.stateText = newStateService.getState();
this.coinId = newStateService.getCoinId(); }