Вы можете создать общий сервис, который будет внедрен как в <app>
, так и в <app-navbar>
. Сервис будет выглядеть примерно так:
@Injectable({
providedIn: 'root',
})
export class SharedService{
public showStepper: boolean = false;
}
Он содержит логическое значение, которое говорит если шаговый двигатель должен отображаться или нет.
Внутри <app-navbar>
, когда пользователь нажимает '+', установите showStepper
на true
.
Далее, внутри <app>
, создайте свойство publi c, которое возвращает значение showStepper
внутри службы следующим образом:
public get showStepper(): boolean {
return this._sharedService.showStepper;
// _sharedService is the injected Service
}
А теперь внутри <app.component.html>
используйте *ngIf directive
для условного отображения ваш шаговый компонент:
<app-stepper *ngIf="showStepper"></app-stepper>