Angular 6 组件作为应用程序组件中的属性答案

【问题标题】：Angular 6 component as Attribute in app componentAngular 6 组件作为应用程序组件中的属性
【发布时间】：2019-01-18 10:08:47
【问题描述】：

我在应用程序组件中使用一个组件作为属性，但是当我将该组件放在我的标签中时，标签的内容为空。

用作属性的我的组件：

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

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

constructor() { }

ngOnInit() {
 }
 }

我的应用组件 html

<div class="tile-block" style="width:300px">
<h3 app-ellipsis-component>  
  this is a just name cdsdsc dsdbskcds jsdbkcs cdslnsl;nks cdsn
</h3>
</div>

但是当我运行这段代码时，h3 标记内没有显示任何内容。谁能帮我解决我的问题？

【问题讨论】：

标签： components angular6

【解决方案1】：

对于用作属性的组件，您必须编写：

选择器：'app-ellipsis-component，[app-ellipsis-component]'，

【讨论】：

【解决方案2】：

其实，方括号表示法就足够了属性选择器了。

我认为最初的例子会起作用，例如：

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

  @Input('app-test')
  truc: string;

  constructor() { }

  ngOnInit() {
  }

}

并这样使用：

<span app-test="toto">bilou</span>

那么你可能没有在应用的任何模块中导入组件：

@NgModule({
  declarations: [
      NavComponent,
      AppComponent,
      TestComponent
  ],

【讨论】：