小编sto*_*oph的帖子

我简化了我的问题：

<div *ngIf="layout1" class="layout1">
  <div class="sidebar-layout1">
     some items
  </div>
  <child-component [something]="sth"></child-component>
</div>
<div *ngIf="!layout1" class="layout2">
  <child-component [something]="sth">
    <p>some content...</p>
  </child-component>
</div>

我有一个父组件，可以使用正常布局（layout1）和全屏布局（layout2）（在全屏模式下，子组件应该处于全屏状态）。问题是，当我使用 *ngIf 更改布局时，子组件将被销毁并生成一个新组件。我想要拥有相同的实例，并且不要丢失子组件的重要信息并避免一些 a​​pi 调用。

有没有什么方法可以实现子组件不会被破坏，或者有没有比 ngIf 更好的方法？

我只需要一个子组件实例来实现父组件中的不同布局。

我创建了一个带有库的新 Angular 7 项目。该库包含一个指令、一个服务和一个模块（指令 get 是注入的服务，而服务是在模块中导出的 injectionToken）。我在编译时收到此警告：

检测到循环依赖项中的警告：projects\auth\src\lib\auth.module.ts -> projects\auth\src\lib\login-form-ref.directive.ts -> projects\auth\src\lib\auth。 service.ts -> projects\auth\src\lib\auth.module.ts

检测到循环依赖项中的警告：projects\auth\src\lib\auth.service.ts -> projects\auth\src\lib\auth.module.ts -> projects\auth\src\lib\login-form-ref。指令.ts -> 项目\auth\src\lib\auth.service.ts

检测到循环依赖项中的警告：projects\auth\src\lib\login-form-ref.directive.ts -> projects\auth\src\lib\auth.service.ts -> projects\auth\src\lib\auth。 module.ts -> projects\auth\src\lib\login-form-ref.directive.ts

auth.service.ts

import { Injectable, Inject } from '@angular/core';
import { HttpClient, HttpHeaders, HttpParams, HttpResponse } from '@angular/common/http';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import { Token } from './models/token';
import { OAuthClient } from './models/oAuthClient';
import { OAUTH_CONFIGURATION } from './auth.module';


@Injectable({
  providedIn: 'root' …