同級component傳遞參數問題

General
1

[Ａ.component.ts ]

constructor(private message: MessageService) {}

ngOInit() {
this.message.putMessage.emit(‘abcd’);
}

[MessageService.service.ts ]
putMessage: EventEmitter<any> = new EventEmitter();

[B.component.ts ]
public Ans: any;
constructor(private message: MessageService) {
this.message.putMessage.subscribe(
params => {
this.Ans = params;
console.log(this.Ans); //可以列印出來**
}
);
console.log(this.Ans) //:joy:印不出來
}

[B.component.html]
<p>{{Ans}}</p> // :joy:完全空白沒有輸出任何東西

請較各位先進們這是什麼樣的問題該如何解決呢？非常感謝各位
[註]：我希望Ｂ能取得Ａ參數後把參數在.html裏輸出即可。

2

你這樣的寫法我會比較建議用rx的subject來應用
然後再B.component.html中使用{{Ans | async}}就可以

另外，ctor就讓他單純只做di就好，其他行為可以拉到ngInit再做

3

請問您的rx的subject的應用是？
[A.ts]
this.message.sendMessage(‘abcdefg’);
[B.ts]
public subscription: Subscription;
ngOnInit() {

 this.subscription = this.message.getMessage().subscribe(msg => {
   this.Ans = msg;
  console.log(this.Ans);   //這裡可以印出來 
  }
   console.log(this.Ans);   //:joy:這裡就印不出來 
}

[html] {{Ans | async}} //:joy:這裡就是印不出來
[service]
public subscription: Subscription;

sendMessage(type: any) {
this.subject.next({type: type});

}

getMessage(): Observable<any> {
return this.subject.asObservable();

}

這個方法我也試過～就是印不出來

4
  1. 要用內文寫程式碼，你最少也用 markdown 語法，這是基本。
  2. 先搞懂同步跟非同步的原理。
  3. 應該是你的程式碼印不出來，請提供 stackblitz / codesandbox / repo。
  4. emoji 正確寫在註解是表達情緒，寫在註解外是惡整想幫你的人。

1個讚
5

謝謝您的回答
真的很抱歉我剛剛也在研究怎麼用markdown我用錯了。
我看了您的寫法跟我的一模一樣但我html就是印不來,好奇怪喔。
undefined部分我知道是非同步問題,真的謝謝你。
我在研究一下比對一下到底我哪裡錯誤了。感謝你