Dependency injection 如何在属性指令中插入指令或组件?

Dependency injection 如何在属性指令中插入指令或组件?,dependency-injection,typescript,angular,angular2-directives,Dependency Injection,Typescript,Angular,Angular2 Directives,Angular 2 rc 1,用打字脚本编写 我有一个带有选择器的属性指令myDirective。它的目的是构建一段我经常重用的html。要完成其工作,匹配类需要访问自定义组件以及另一个属性指令。我很难弄清楚如何在myDirective的类中插入属性指令或组件 @Directive({selector: '[myDirective]'}) export class MyDirective{ constructor(private renderer:Renderer, private el

Angular 2 rc 1,用打字脚本编写

我有一个带有选择器的属性指令
myDirective
。它的目的是构建一段我经常重用的html。要完成其工作,匹配类需要访问自定义组件以及另一个属性指令。我很难弄清楚如何在
myDirective
的类中插入属性指令或组件

@Directive({selector: '[myDirective]'})
export class MyDirective{
    constructor(private renderer:Renderer, private elementRef:ElementRef) {
        let el = elementRef.nativeElement; //capture the HTML element host
        let innerElement = renderer.createElement(el,'my-component',null);
        renderer.setElementAttribute(innerElement,'myOtherDirective','');
    }
}
用法:

生成的HTML:

问题是角度模板解析器不处理
my component
myOtherDirective
,当然浏览器也无法识别它们。我有两个问题:

  • 如何在属性指令中插入另一个指令或组件

  • 我是否在这里误用了attribute指令?组件是否更适合


  • 这是对
    指令的误用
    创建一个
    组件
    ,这样您就可以像

    <my-component></my-component>
    
    可以使用属性指令传递值

    <div [my-directive]="I'm a value!"> I'm a component with directive!!!</div>
    
    我是一个有指令的组件!!!
    
    查看官方文件了解详细信息:


    我建议你看这节视频课。这对我非常有帮助。

    这是对
    指令的误用
    创建一个
    组件
    ,这样您就可以像

    <my-component></my-component>
    
    可以使用属性指令传递值

    <div [my-directive]="I'm a value!"> I'm a component with directive!!!</div>
    
    我是一个有指令的组件!!!
    
    查看官方文件了解详细信息:


    我建议你看这节视频课。这对我非常有帮助。

    我在等待响应并构建组件时得出了相同的结论。我想我很难在组件何时合适和属性指令何时合适之间找到一个清晰的界限。我认为我能想出的最好办法是,如果我需要一个视图模板,我应该使用一个组件。赞成这个建议;我仍然想知道如何在另一个指令中注入属性指令。这正是区别所在。组件有视图,指令没有。我在等待响应时得出了相同的结论,并构建了一个组件。我想我很难在组件何时合适和属性指令何时合适之间找到一个清晰的界限。我认为我能想出的最好办法是,如果我需要一个视图模板,我应该使用一个组件。赞成这个建议;我仍然想知道如何在另一个指令中注入属性指令。这正是区别所在。组件有视图,指令没有。