Question

在我的代码中，我有一个视频聊天组件，其中有两个子组件app-subscriber和app-publisher。

<div *ngIf="session">
      <div class="row">
        <div class="col-md-1"></div>
        <div class="col-md-7">
        <div class="well">
           <app-subscriber *ngFor="let stream of streams" [stream]="stream" [session]="session"></app-subscriber>
        </div>
        <app-publisher [session]="session">&nbsp;
        </app-publisher>
        <button class="btn btn-default"><a href="#" routerLink="/chat"><i class="fa fa-phone" aria-hidden="true" style="color: red;"></i> &nbsp; End Call</a></button>
 </div>

我如何将发布者组件放置为订阅者组件的叠加

Answer 1

<div *ngIf="session">
  <div class="row">
    <div class="col-md-1"></div>
    <div class="col-md-7">
      <app-publisher [session]="session">&nbsp;
      </app-publisher>
      <div class="well">
       <app-subscriber *ngFor="let stream of streams" [stream]="stream" [session]="session"></app-subscriber>
    </div>
      <button class="btn btn-default"><a href="#" routerLink="/chat"><i class="fa fa-phone" aria-hidden="true" style="color: red;"></i> &nbsp; End Call</a></button>
  </div>

只需将发布者组件粘贴到订户组件上方。您这样做是否遇到任何问题？

Answer 2

我认为这可能会有所帮助。

<div *ngIf="session">
    <div class="row">
        <div class="col-md-1"></div>
        <div class="col-md-7">
            <app-publisher [session]="session">&nbsp;</app-publisher>
            <div class="well">
                <app-subscriber *ngFor="let stream of streams" [stream]="stream" [session]="session"></app-subscriber>
            </div>
            <button class="btn btn-default">
                <a href="#" routerLink="/chat">
                    <i class="fa fa-phone" aria-hidden="true" style="color: red;"></i> &nbsp; End Call</a>
            </button>
        </div>
    </div>
</div>

Answer 3

通过添加相对于应用程序订阅者的位置和相对于应用程序发布者的绝对位置，我能够使发布者成为订阅者的叠加层。无论如何，谢谢大家。

Angular 2-如何将一个子组件作为另一个子组件的叠加放置在父组件中

3 个答案: