7-образное изображение Angular для View, состоящее из 2 или более компонентов? - PullRequest
Новая
       1

7-образное изображение Angular для View, состоящее из 2 или более компонентов?

0 голосов
/ 24 февраля 2019

это мой html: 

<app-navbar></app-navbar>
<router-outlet></router-outlet>

Я хочу установить изображение в качестве фона для домашнего просмотра, которое разделено на 2 компонента (navbarComponent и homeComponent -selector), но это не будет применяться вдругие компоненты (например, contactComponent - предлагают использовать другое изображение, с селекторами app-navbar и app-contact).

Так как я могу использовать изображение в качестве фона для представления, составленного app-navbar иapp-home ???

1 Ответ

0 голосов
/ 24 февраля 2019

Почему бы не добавить фоновое изображение в качестве класса CSS для вашего тега <body>, который вы можете определить в глобальном файле styles.css, а затем под страницей / маршрутом, который вы хотели бы показать, добавьте этот классвведите имя тега <body>, используя один из этих двух вариантов.

Первый вариант является самым простым, но менее рекомендуемым: 

constructor(@Inject(DOCUMENT) private document: Document) {}

ngOnInit(){
   this.document.body.classList.add('test');
}

Второй вариант (моя личная рекомендация) заключается в реализациипользовательский класс рендеринга из пакета @angular/core: 

import { Component, OnDestroy, Renderer2 } from '@angular/core';

export class myCoolComponent implements OnDestroy {

  constructor(private renderer: Renderer2) {
    this.renderer.addClass(document.body, 'test');
   }

  ngOnDestroy() {
    this.renderer.removeClass(document.body, 'test');
  }

Надеюсь, это поможет вам!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...