File

src/app/components/header/header.component.ts

Description

Estamos con el header

Implements

OnInit OnDestroy

Metadata

selector blog-header
styleUrls ./header.component.css
templateUrl ./header.component.html

Index

Properties
Methods

Constructor

constructor(config: ConfigService)

un comentario

Parameters :
Name Type Optional Description
config ConfigService No

parametro config

Methods

hola
hola()

Hoaaaaa

Returns : void
Private holaHola
holaHola()

Hoaaaaa

Returns : void
ngOnDestroy
ngOnDestroy()

Destruir!!!

Returns : void
ngOnInit
ngOnInit()

Init!!!

Returns : void

Properties

bgUrl
bgUrl: string
Type : string

url del background

import { ConfigService } from './../../services/config.service';
import { Component, OnInit, OnDestroy } from '@angular/core';

/**
 * Estamos con el header
 */
@Component({
  selector: 'blog-header',
  templateUrl: './header.component.html',
  styleUrls: ['./header.component.css']
})
export class HeaderComponent implements OnInit, OnDestroy {
  /**
   * url del background
   */
  bgUrl: string;
  /**
   * un comentario
   * @param config parametro config
   */
  constructor(private config: ConfigService) {
    this.config.bgVar$.subscribe( data => {
      console.log('header', data);
      this.bgUrl = data;
    });
  }

  /**
   * Init!!!
   */
  ngOnInit() {
    console.log('Hola');
  }

  /**
   * Hoaaaaa
   */
  hola() {
    console.log('hola');
  }

  /**
   * Hoaaaaa
   */
  private holaHola() {
    console.log('hola');
  }

  /**
   * Destruir!!!
   */
  ngOnDestroy() {
    console.log('Destroy');
  }

}
<!-- Page Header -->
<header class="masthead" [ngStyle]="{background: 'url(' + bgUrl + ')'}"
  >
  <div class="overlay"></div>
  <div class="container">
    <div class="row">
      <div class="col-lg-8 col-md-10 mx-auto">
        <div class="site-heading">
          <h1>Clean Blog</h1>
          <span class="subheading">A Blog Theme by Start Bootstrap</span>
        </div>
      </div>
    </div>
  </div>
</header>

./header.component.css

Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""