将Angular2组件作为类或属性而不是标记

Question

在Angular1中，您可以直接将HTML插入index.html或index.php，如下所示：

<div ng-controller="pricingController">
  {{price}} - Total Cost
</div>

在Angular2中，您必须使用一个强制您在组件中使用TemplateURL的组件。

我想做一些更类似于Angular 1格式的事情。

直接在HTML中使用这样的东西：

<div ngComponent="pricing-component">
  {{price}} - Total Price
</div>

而不是：

<pricing-component></pricing-component>

Answer 1

如果要使用属性，可以使用属性选择器和指令。指令是没有模板的组件。或者更好地说，组件是带有模板的指令：

<div pricing>
  {{price}} - Total Price
</div>

您的Pricing将在指令注释中包含此选择器：

@Directive({
  selector : '[pricing]'
})
export class PricingDirective {}