在角度組件之間傳遞參數不起作用

Question

我正在編寫一個角度程序。 它有兩個組成部分（財產價值和購買費用）。 兩者都嵌入在 app.component.html 中。 我希望如果屬性值中的參數發生變化，則更改應反映在購買費用中。 組件不處於父子關系中。

我在服務類中使用了 Observable，但似乎 PurchaseExpensesComponent 中代碼的訂閱部分沒有被調用，因此更改沒有反映在購買費用組件 UI 中。

我不知道為什么。 任何幫助將不勝感激。

代碼 -

https://stackblitz.com/edit/angular-lvhkuv

Answer 1

您已經在根模塊中提供了 CashflowService：

@Injectable({
  providedIn: 'root'
})
export class CashFlowService {

...所以你應該刪除或評論行providers:在PurchaseExpensesComponent

@Component({
  selector: 'app-purchase-expenses',
  templateUrl: './purchase-expenses.component.html',
  styleUrls: ['./purchase-expenses.component.css'],
  //providers: [CashFlowService] <==== REMOVE OR COMMENT THIS LINE
})

...並在PropertyValueComponent

@Component({
  selector: 'app-property-value',
  templateUrl: './property-value.component.html',
  styleUrls: ['./property-value.component.css'],
  //providers: [CashFlowService] <==== REMOVE OR COMMENT THIS LINE
})

因此，您為每個組件提供服務的本地實例，並且每個組件都在調用其自己實例的方法。 相反，您應該擁有一個由所有組件共享的單例服務。

檢查我根據您的代碼制作的這個 stackblitz。 唯一的變化是上面提到的那些： https : //stackblitz.com/edit/angular-7uuarq