使用 css 类选择器在角度组件上传递输入属性

Posted 2023-03-13

【中文标题】使用 css 类选择器在角度组件上传递输入属性

【英文标题】：Passing input properties over angular component with css class selector

【发布时间】：2019-02-16 05:15:21

【问题描述】：

我有一个带有类选择器的组件。 popup 是带有 css 类选择器 '.popup' 的组件

<div class="popup">
  My Content
</div>

我想通过它传递一些输入和输出属性，例如，就像普通的组件选择器一样

<div class='popup' [open]="open" (afterclose)="afterclose">
</div>

但我收到错误 - Can't bind to 'open' since it isn't a known property of 'div'.

我的组件：-

@Component(
  selector: '.popup',
  templateUrl: './popup.component.html',
  styleUrls: ['./popupx.component.scss']
)

export class PopupComponent 
  @Input() open:boolean;
  @Output() afterClose: EventEmitter<any> = new EventEmitter();

我们怎样才能做到这一点？

【参考方案1】：

因为您尝试向 div 发送数据。 命名您的组件并将数据传递给它，例如：

<popup [open]="open"></popup>

【讨论】：

我不想要这种方式，我已经知道了，我想把它当作一个类来使用。

请看选择器——选择器：'.popup'，

【参考方案2】：

不要创建弹出组件，而是创建弹出指令并在 DIV 上使用它。然后您将能够使用定义的输入和输出。

【讨论】：

谢谢，我会试试的。