### File

`src/sample/subcomponent/sample-sub.component.ts`

### Description

this is a sample sub-component

### Implements

`SampleBase` `OnChanges`

### Metadata

providers | `{ provide: SampleBase, useExisting: forwardRef(() => SampleSub) }`
selector | `ibm-sample-sub`

template

    <span>Hello from a subcomponent</span>

### Index

###### Properties

- Public type

###### Methods

- getNextFoo
- ngOnChanges

###### Inputs

- foo

###### Outputs

- bar

### Inputs

`foo` | input foo Type : `SampleInterface`
Defined in src/sample/subcomponent/sample-sub.component.ts:26

### Outputs

`bar` | bar emits an Object of some type `$event` Type: `EventEmitter<Object>`
Defined in src/sample/subcomponent/sample-sub.component.ts:28

### Methods

getNextFoo
`getNextFoo()`
Defined in src/sample/subcomponent/sample-sub.component.ts:40
an instance method Returns : `SampleInterface`

ngOnChanges
`ngOnChanges(changes)`
Defined in src/sample/subcomponent/sample-sub.component.ts:35

for changes and initilization that must happen before anything else

Parameters :

Name | Optional
changes | No

Returns : `void`

### Properties

Public type
`type: `"single" | "multi"``
Type : `"single" | "multi"`
Default value : `"single"`
Defined in src/sample/subcomponent/sample-sub.component.ts:30
here's a instance variable that takes a union of "single" | "multi"

    import {
    	Component,
    	Input,
    	Output,
    	EventEmitter,
    	forwardRef,
    	OnChanges
    } from "@angular/core";

    import { SampleBase } from "./../sample-base.class";
    import { SampleInterface } from "./../sample.interface";

    /**
     * this is a sample sub-component
     */
    @Component({
    	selector: "ibm-sample-sub",
    	template: `
    		<span>Hello from a subcomponent</span>
    	`,
    		// tslint:disable-next-line:no-forward-ref
    		providers: [{provide: SampleBase, useExisting: forwardRef(() => SampleSub)}]
    })
    export class SampleSub implements SampleBase, OnChanges {
    	/** input foo */
    	@Input() foo: SampleInterface;
    	/** bar emits an Object of some type */
    	@Output() bar: EventEmitter<Object>;
    	/** here's a instance variable that takes a union of "single" | "multi" */
    	public type: "single" | "multi" = "single";

    	// not every component will need a constructor

    	/** for changes and initilization that must happen before anything else */
    	ngOnChanges(changes) {
    		//
    	}

    	/** an instance method */
    	getNextFoo(): SampleInterface { return; }
    }

Legend
Html element
Component
Html element with directive

# result-matching ""

# No results matching ""