Passing Data into a Component angular5

Question

the value "name" is not initialized in component . There are a ways to pass data into a component using decorator @input?

ng -v

Angular CLI: 1.6.3

Node: 8.9.4

OS: linux x64

Angular: 5.1.3

My app.component.ts

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

@Component({
    selector: 'hello-world',
    template: '<p>Hello, {{name}}!</p>',
})
export class HelloComponent {
    @Input() name: string;
}

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HelloComponent } from './app.component';

@NgModule({
   declarations: [
       HelloComponent
   ],
   imports: [
       BrowserModule,FormsModule
   ],
   providers: [],
   bootstrap: [HelloComponent]
})
export class AppModule { }

index.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Front</title>
    <base href="/">
    <meta name="viewport" content="width=device-width, initial-  scale=1">
    <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>

     <hello-world name="World"></hello-world>

</body>
</html>

The problem is that you cannot pass a paramter to a bootstrapped component. see: https://stackoverflow.com/a/43544999/1129564 — Daniel, Jan 09 '18 at 06:01

Passing Data into a Component angular5

0 Answers0