### File

`src/placeholder/placeholder.component.ts`

### Description

Using a modal, dialog (Tooltip, OverflowMenu), or any other component that draws out of the normal page flow in your application requires this component (`ibm-placeholder`). It would generally be placed near the end of your root app component template (app.component.ts or app.component.html) as:

     * <ibm-placeholder></ibm-placeholder>
     *

### Implements

`OnInit`

### Metadata

selector | `ibm-placeholder`

template

    <div #placeholder></div>

### Index

###### Properties

- Public placeholderService
- viewContainerRef

###### Methods

- ngOnInit

### Constructor

`constructor(placeholderService: PlaceholderService)`
Defined in src/placeholder/placeholder.component.ts:27

Creates an instance of `Placeholder`.

Parameters :

Name | Type | Optional
placeholderService | `PlaceholderService` | No

### Methods

ngOnInit
`ngOnInit()`
Defined in src/placeholder/placeholder.component.ts:37
Registers the components view with `PlaceholderService` Returns : `void`

### Properties

Public placeholderService
`placeholderService: `PlaceholderService``
Type : `PlaceholderService`
Defined in src/placeholder/placeholder.component.ts:32

viewContainerRef
`viewContainerRef: `ViewContainerRef``
Type : `ViewContainerRef`
Decorators : `@ViewChild('placeholder', {read: ViewContainerRef})`
Defined in src/placeholder/placeholder.component.ts:27
Maintains a reference to the view DOM element of the `Placeholder`.

    import {
    	Component,
    	OnInit,
    	ViewContainerRef,
    	ViewChild
    } from "@angular/core";
    import { PlaceholderService } from "./placeholder.service";

    /**
     * Using a modal, dialog (Tooltip, OverflowMenu), or any other component that draws out of the normal page flow
     * in your application *requires* this component (`ibm-placeholder`).
     * It would generally be placed near the end of your root app component template
     * (app.component.ts or app.component.html) as:
     *
     * ```
     * <ibm-placeholder></ibm-placeholder>
     * ```
     */
    @Component({
    	selector: "ibm-placeholder",
    	template: `<div #placeholder></div>`
    })
    export class Placeholder implements OnInit {
    	/**
    	 * Maintains a reference to the view DOM element of the `Placeholder`.
    	 */
    	@ViewChild("placeholder", { read: ViewContainerRef }) viewContainerRef: ViewContainerRef;

    	/**
    	 * Creates an instance of `Placeholder`.
    	 */
    	constructor(public placeholderService: PlaceholderService) { }

    	/**
    	 * Registers the components view with `PlaceholderService`
    	 */
    	ngOnInit() {
    		this.placeholderService.registerViewContainerRef(this.viewContainerRef);
    	}
    }

Legend
Html element
Component
Html element with directive

# result-matching ""

# No results matching ""