Angular 将ng模板插入子组件，但不呈现传入的模板

我有一个名为auth的父组件。在这个组件中，我有一个ng模板，它是一个表示登录/注册表单的表单，如下所示：

`<ng-template #authForm>
    <form [formGroup]="authForm" (ngSubmit)="onSubmit()">
      <mat-form-field>
        <input matInput placeholder="Username" formControlName="userName" >
        <mat-error *ngIf="postForm.get('userName').invalid">You must enter a value</mat-error>
      </mat-form-field>
      <mat-form-field>
        <input matInput placeholder="E-mail" formControlName="email" >
        <mat-error *ngIf="postForm.get('email').invalid">You must enter a value</mat-error>
      </mat-form-field>
      <mat-form-field>
        <input matInput placeholder="Password" formControlName="password" type="password">
        <mat-error *ngIf="postForm.get('password').invalid">You must enter a value</mat-error>
      </mat-form-field>
    </form>
  </ng-template>`

`
您必须输入一个值
您必须输入一个值
您必须输入一个值
`

在同一父组件中，我使用“角材质材质材质”选项卡“组组件”来显示登录组件或注册组件：

`<mat-tab-group (selectedTabChange)="onSignup($event)">
    <mat-tab label="Login">
        <ng-container *ngIf="!isSignup">
            <app-login [loginForm]="authForm"></app-login>  
          </ng-container>
    </mat-tab>
    <mat-tab label="Sign Up"> 
        <ng-container *ngIf="isSignup">
            <app-signup></app-signup>
          </ng-container>
    </mat-tab>
</mat-tab-group>`

`
问题是您有两个
authForm
变量名。将ng模板名称更改为其他名称，如下所示。工作样本


您必须输入一个值
您必须输入一个值
您必须输入一个值
这可能是由于此标志
*ngIf=“！isSignup”
，请检查是否调用了应用程序登录的ngOnInit是的，我在LoginComponent内的ngOnInit中有一个日志，并且它被调用。当我不将任何模板传递给子组件时，它们渲染得很好。在登录和注册之间的切换按预期工作。但一旦我试图传递一个元素，它就会停止工作。你能复制一个stackblitz吗？现在就开始工作。-这是我对表单的基本设置嗯，我认为这可以解决这个问题，但我仍然看到同样的事情。这不完全是这样。好主意。我更改了变量名，但它不起作用。不管你是对的，它都在起作用。这与我的条件逻辑有关。非常感谢你！
`<ng-container 
  *ngTemplateOutlet="loginForm">
</ng-container>`

<ng-template #authFormTemplate>
    <form [formGroup]="authForm" (ngSubmit)="onSubmit()">
      <mat-form-field>
        <input matInput placeholder="Username" formControlName="userName" >
        <mat-error *ngIf="postForm.get('userName').invalid">You must enter a value</mat-error>
      </mat-form-field>
      <mat-form-field>
        <input matInput placeholder="E-mail" formControlName="email" >
        <mat-error *ngIf="postForm.get('email').invalid">You must enter a value</mat-error>
      </mat-form-field>
      <mat-form-field>
        <input matInput placeholder="Password" formControlName="password" type="password">
        <mat-error *ngIf="postForm.get('password').invalid">You must enter a value</mat-error>
      </mat-form-field>
    </form>
  </ng-template>

<mat-tab-group (selectedTabChange)="onSignup($event)">
    <mat-tab label="Login">
        <ng-container *ngIf="!isSignup">
            <app-login [loginForm]="authFormTemplate"></app-login>  
          </ng-container>
    </mat-tab>
    <mat-tab label="Sign Up"> 
        <ng-container *ngIf="isSignup">

          </ng-container>
    </mat-tab>
</mat-tab-group>