Angular 2 - Multiple Component doesn't work

Question

I learned angular 2, but I can't do a multiple component, for exemple I try this and is doesen't work :

app.module.ts :

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent }  from './app.component';
import { TestComponent } from './test.component';

@NgModule({
  imports:      [ BrowserModule ],
  declarations: [ AppComponent, TestComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

app.component.ts :

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

@Component({
    moduleId: module.id,
    selector: 'my-app',
    templateUrl: './app.component.html'
})

export class AppComponent  {}

test.component.ts :

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

@Component({
    moduleId: module.id,
    selector: 'test',
    templateUrl: './test.component.html'
})

export class TestComponent {}

app.component.html :

<h1>Hello World!</h1>

test.component.html :

<h2>test</h2>

Can you show us, what you did in ./app.component.html? It would work if you have specified test inside AppComponent html.. — Pankaj Parkar
– Pankaj Parkar, Commented Jan 15, 2017 at 13:54
Do you want your test component to display inside your app component? If so, add <test></test> to app.component.html — Carlos Mermingas
– Carlos Mermingas, Commented Jan 15, 2017 at 14:10

Doehl · Accepted Answer · 2017-01-15 15:06:27Z

1

You have to "call" the test component from the app.

And in Angular 2, it is done with html tag selectors.

If you add <test></test>

in app.component.html, it should render the test component.

answered Jan 15, 2017 at 15:06

Doehl

3965 silver badges5 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular 2 - Multiple Component doesn't work

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related