Angular 如何在OnInit之后更新视图上的属性绑定？（角度）

我在服务中使用BehaviorSubject将所选对象广播到其他组件。该服务的一切工作都正常，包括更新选定对象

我的问题是，当我在试图获取对象的组件中运行服务时，ngOnInit会更新变量的属性，但在我的视图中不会更新

我曾尝试使用onChanges生命周期钩子，但显然这对对象不起作用

请告诉我我做错了什么。我知道我丢失了几行代码，仅此而已

这是我的父组件TypeScript文件

  open(content, product: Product) {
    this.modalService2.open(content, { windowClass: 'dark-modal' });
    this.addToCartService.changeProduct(product);
  }

每当我在视图上单击“添加到购物车”时，它都会触发“Open（）”方法，该方法将所选产品发送到服务，即此

添加到购物车服务代码：

@Injectable()
export class AddToCartService {

    product: Product;

    private productSource = new BehaviorSubject<Product>(this.product);
    currentProduct = this.productSource.asObservable();

    constructor() { }

    changeProduct(product: Product){
        this.productSource.next(product);
    }
}

最初它是未定义的，然后调用服务，变量beerselected更新其属性，但是视图绑定到beerselected，但是它仍然显示未定义

Product Model class:

   export class Product
{
    id: string="beer 1";
    beerName: string="beer 2";
    alcoholPercent: number=5;
    beerType: string="pilser";
    beerPrice: number=10;
    beerAmount: number=120;
    servingSize: number=8;
    beerPicture: string="../assets/";
}

此外，如果有帮助，这里是添加到购物车的HTML

   <div class="col-8">
              <h5 class="m-b-0">Beer Name: {{beerselected?.beername}}</h5>
              <ngb-rating [(rate)]="selected" (hover)="hovered=$event" (leave)="hovered=0" [readonly]="readonly"></ngb-rating><br>
              <span><b>Type: </b></span>
              <span class="text-muted">{{beerselected?.beername}}</span> <br>
              <span><b>Alcohol %: </b></span>
              <span class="text-muted">{{beerselected?.beername}}</span> <br>
              <span><b>Description: </b></span>
              <span class="text-muted"></span> <br>
          </div>

啤酒名称：{{beerselected？.beername}


类型：
{{beerselected？.beername}}

酒精%：
{{beerselected？.beername}}

说明：

---

好的，我找到的解决方案是在前端绑定数据的方式。不是使用{beerselected.“which property”}，而是需要使用{{beerselected.product.property}

好的，我找到的解决方案是在前端绑定数据的方式。不使用{{beerselected.“which property”}，而是需要使用{{beerselected.product.property}

查看您为什么使用？在对象中选择？beername的目的是什么？在viewwell中，beerselected是调用服务时正在更新的变量。“beer”对象上有多个属性，包括beerid、beername、beertype等。我问在对象属性中有问号符号为什么在BearName之前使用此问号符号，否则它会抛出一个错误，即属性未定义Perhaps changeDetection可能有帮助？鉴于为什么使用？在对象中选择？beername的目的是什么？在viewwell中，beerselected是调用服务时正在更新的变量。“beer”对象上有多个属性，包括beerid、beername、beertype等。我问在对象属性中有问号符号为什么在BearName之前使用此问号符号，否则它会抛出一个错误，即属性未定义Perhaps changeDetection可能有帮助吗？它解决了您的问题，你知道为什么会这样吗。您将新啤酒分配给beerselected，而不是指定其成为beerselected的财产，您能给我看一下beerselected declaretion吗？它解决了您的问题，您知道为什么会发生这种情况吗。您将新啤酒分配给beerselected，而不是指定其成为beerselected的财产，您能给我看一下beerselected的声明吗？

   <div class="col-8">
              <h5 class="m-b-0">Beer Name: {{beerselected?.beername}}</h5>
              <ngb-rating [(rate)]="selected" (hover)="hovered=$event" (leave)="hovered=0" [readonly]="readonly"></ngb-rating><br>
              <span><b>Type: </b></span>
              <span class="text-muted">{{beerselected?.beername}}</span> <br>
              <span><b>Alcohol %: </b></span>
              <span class="text-muted">{{beerselected?.beername}}</span> <br>
              <span><b>Description: </b></span>
              <span class="text-muted"></span> <br>
          </div>