如何用DIV標籤屬性初始化AngularJS組件？

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); 

當我不喜歡這樣，我沒有看到 「貼組件」 文本。

但是，如果我用自定義元素它的作品。

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

但我需要DIV。

Answer 1

根據這個comparison table between directives and components，組件只有元素限制。您應該使用指令restrict: 'A'（屬性）而不是組件。