如何区分角度6中的组件

Question

我正在尝试创建一个全局组件，但它在所有地方都一样工作。我想使用不同的标签值和许多宫殿，如全局组件。我正在学习 Angular 6，所以现在面临麻烦。如何解决？

服务：

  addComp(Names,c){
  let item = {name: Names, componentid: c};
  if (this.item.find((test) => test.name === Names) === undefined) {
  this.item.push(item);
  }
  }

Answer 1

您可以使用@Input 装饰器在您的BreadcrumbDemoComponent 中声明您想要不同的值，并将这些值作为属性传递到选择器标记中。

例子：

app-component.html

<breadcrumb-demo [label]="'Value 1'"></breadcrumb-demo>
<breadcrumb-demo [label]="'Value 2'"></breadcrumb-demo>

breadcrumb-demo.component.ts

...
export class BreadcrumbDemoComponent {
@Input() label;
...
}

breadcrumb-demo.component.html

...
<h1>{{ label }}</h1>
...