首页 文章

如何在Angular 4中创建嵌套组件?

提问于
浏览
0

我创建了一个名为Parent和Child的组件 . 我想将ChildComponent的所有UI显示给我的ParentComponent .

child.component.ts

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

@Component({
  selector: 'app-child',
  templateUrl: './child.component.html',
  styleUrls: ['./child.component.scss']
})
export class ChildComponent implements OnInit {

  testContent = 'child component content...';

  constructor() { }

  ngOnInit() {
  }

}

child.component.html

<p>{{testContent}}</p>

parent.component.ts

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

@Component({
  selector: 'app-admin',
  templateUrl: './admin.component.html',
  styleUrls: ['./admin.component.scss'],
  directives: [ChildComponent]
})
export class AdminComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

}

parent.component.html

<div>
  Lorem ipsum
  <app-child></app-child>
</div>

我想在父组件中显示子组件的内容 . 但是,我在Angular 4中遇到错误

“对象文字只能指定已知属性,'组件'类型中不存在'指令' . ”

您是否知道添加子组件的替代属性是什么?

2 回答

  • 0

    从父组件中删除指令,并将子组件添加到父组件所在的模块声明数组中 .

  • 1

    @component 中的指令和管道因角度RC6而被弃用 . 只需将其从组件中删除即可 .

    @Component({
      selector: 'app-admin',
      templateUrl: './admin.component.html',
      styleUrls: ['./admin.component.scss']
    })
    

相关问题