第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

角。如何根據(jù)服務(wù)的操作切換組件

角。如何根據(jù)服務(wù)的操作切換組件

哆啦的時光機 2022-10-08 15:46:39
假設(shè)我有 2 個組件,aComponent并且bComponent. 我把它們重新放在里面AppComponent<app-a><app-b>而且我有myService有方法的服務(wù).trigger()。我想要的是僅顯示aComponent,但每當我myService.trigger()從另一部分代碼調(diào)用時,它就會切換并顯示bComponent。這是我無法達到的完美實現(xiàn)。問題是:有可能這樣做嗎?如果不是什么是最好的最接近的解決方案。我得到的唯一可行的解決方案:我.trigger()在里面加了AppComponentexport class AppComponent {  title = 'spa';  show: boolean = false;  trigger() {    this.show = true;  }}并像這樣渲染組件:<div *ngIf="!show; else show">  <app-a></app-a></div><ng-template #show>  <app-b></app-b></ng-template>然后每當我想觸發(fā)切換時,我將應(yīng)用程序的實例添加到構(gòu)造函數(shù)并調(diào)用它的方法:export class AnotherComponent implements OnInit {  constructor(    private app: AppComponent  ) {}  ngOnInit(): void {    this.app.trigger();  }}即使它工作得很好,我自己也看到這是一個骯臟的解決方案。組件不打算在另一個組件內(nèi)部使用,但服務(wù)是。
查看完整描述

2 回答

?
慕妹3242003

TA貢獻1824條經(jīng)驗 獲得超6個贊

你可以Subject從rxjs圖書館使用。


在您的服務(wù)文件中:


// a-service.service.ts

import { Injectable } from '@angular/core';

import { Subject } from 'rxjs';


@Injectable({ providedIn: 'root' })

export class AService {

    private subject = new Subject<any>();


    trigger(state: boolean) {

        this.subject.next(state);

    }


    getTrigger(): Subject<any> {

        return this.subject;

    }

}

在你的AppComponent:


// app.component.ts

...

private show = false;


constructor (private aService: AService) { }


ngOnInit() {

    this.aService.getTrigger().subscribe(state => {

        this.show = state;

    });

}

模板可以是您提供的 - 很好:


<div *ngIf="!show; else show">

  <app-a></app-a>

</div>


<ng-template #show>

  <app-b></app-b>

</ng-template>

如果你想從另一個組件觸發(fā),你可以這樣做:


// another.component.ts

...    

constructor (private aService: AService) { }


ngOnInit() {

    this.aService.trigger(true);

}


查看完整回答
反對 回復 2022-10-08
?
SMILET

TA貢獻1796條經(jīng)驗 獲得超4個贊

在不直接相關(guān)的不同組件和服務(wù)之間進行通信的一種方法是通過“主題”。

您可以嘗試創(chuàng)建一個主題并將值從myService.trigger()subject您可以從要訪問該觸發(fā)器數(shù)據(jù)的任何組件訂閱它。


查看完整回答
反對 回復 2022-10-08
  • 2 回答
  • 0 關(guān)注
  • 110 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號