如何将 [ngClass] 添加到 Angular 中动态创建的元素？

Question

我有一个诺基亚地图插件，它需要我使用 document.createElement('div') 在地图上创建标记。 我想将这个新 div 绑定到 ngClass，是否有可能在 Angular 中执行此操作？

如果你知道我在这里试图解释的术语，那将是一个很大的帮助，因为我在 Vue 和 React 上做了这种事情没有问题，我只是无法向谷歌（或任何人解释）问题）我想做什么。

Answer 1

是的，您可以通过以下方式实现这一目标

假设你已经创建了一个div

var div = '<div ng-class="yourClassName">Any text here or whatever</div>';

现在您必须为此元素进行动态编译以将其与controller scope绑定，例如

  var newDiv= $compile(div)($scope); 

现在您可以将它们附加到任何DOM元素。 例如

$('.anyOtherDivClass').append(newDiv)

这将允许所有事件（如ng-click等）为您动态创建的元素触发。

附言。 不要忘记在控制器中注入$compile服务。

希望这有帮助

Answer 2

使用带有 getter 函数的 @HostBinding 来返回一个类是否应该存在。

类似的东西：

@HostBinding("class.newclass") get isInfo() { return this.type === "info" }