Question

我想只使用一个自定义属性来实例化这样的组件：

的index.html

<div evaluation-paste></div>

其余代码：

evaluation.paste.ts

export const evaluationPasteComponent: angular.IComponentOptions = {
  template: require('./evaluation.paste.html'),
};

evalutaion.paste.html

<div class="row">
  paste component
</div>

index.ts

import * as angular from 'angular';
import { EvaluationController } from './evaluation.controller';
import { evaluationPasteComponent } from './evaluation.paste';
import { evaluationParseComponent } from './evaluation.parse';
import { evaluationSummaryComponent } from './evaluation.summary';


const evaluationComponent: angular.IComponentOptions = {
  template: require('./evaluation.html'),
  controller: EvaluationController,
  controllerAs: 'evaluation'
};

export const evaluationModule = 'evaluation';

angular.module(evaluationModule, [])
  .component('evaluationPaste', evaluationPasteComponent)
  .component('evaluationParse', evaluationParseComponent)
  .component('evaluationSummary', evaluationSummaryComponent)
  .component('evaluation', evaluationComponent);

当我这样做时，我不会看到＆＃34;粘贴组件＆＃34;文本。

但是，如果我使用自定义元素，它可以工作。

<evaluation-paste ng-show="evaluation.step == 'paste'"></evaluation-paste>

但我需要DIV。

Answer 1

根据这个comparison table between directives and components，组件只有元素限制。您应该使用带production（属性）的指令而不是组件。

如何使用DIV标记属性初始化AngularJS组件？

1 个答案: