Question

我正在尝试使用主要组件内部的子组件app.component，使用主组件模板中的选择器。但它不起作用。

child.component.ts

import { Component} from '@angular/core';
@Component({
selector: 'child-component',
templateUrl: `<p>Child Component</p>`
})
export class ChildComponent  {  }

app.component.ts

import { Component } from '@angular/core';
import { ChildComponent} from './child.component';

@Component({
selector: 'my-app',
template: `<h1>Hello Angular!</h1>
<child-component>    </child-component>       `
})

export class AppComponent { }

我在下面的模块中为ChildComponent

做了声明

app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { ChildComponent} from './child.component';
import { AppComponent } from './app.component';

@NgModule({
imports: [BrowserModule],
declarations: [AppComponent,ChildComponent],
bootstrap: [AppComponent]
})

export class AppModule { }

How to import component into another root component in Angular 2中提到的解决方案不起作用。

请帮助解决问题。

Answer 1

您在child-component元选项中输了错字。

templateUrl: `<p>Child Component</p>`

应该是

template: `<p>Child Component</p>`

无法在Angular2中的父组件中使用子组件

1 个答案: