Pass variable to custom component

Question

I have my custom component:

@Component({
    selector: \'my-custom-component\',
    templateUrl: \'./my-custom-component.html\',
    styleUrls: [\'./my-custo         


        

Answer 1

You need to add Input property to your component and then use property binding to pass value to it:

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

@Component({
    selector: 'my-custom-component',
    templateUrl: './my-custom-component.html',
    styleUrls: ['./my-custom-component.css']
})
export class MyCustomComponent {

    @Input()
    customTitle: string;

    constructor() {
        console.log('myCustomComponent');
    }

    ngOnInit() {
        console.log(this.customTitle);
    }
}

And in your template:

For more info, check out this page.