我对angular2有疑问.我正在创建一些组件,并希望有这样的东西:

这是我的DogComponent类:

@Component({
    selector: "dog",
    template: "dog.template.html"
})
class DogComponent
{
    @Input() image: string;
}

以及dog.template.html中的模板:

当我使用DogComponent,它应该创建IMG标签与传递的SRC,但在此之前和之后的图像还可以查看其他HTML部分.

所以最后,如果我写这段代码:

    
        
This is Garry!
    
    
        He is my favorite dog!
    

它应该呈现给:

    

        
This is Garry!
        
        He is my favorite dog!
    

有人有我的问题的答案吗？

这会很棒!

编辑:

感谢您的建议,所以现在我更新了我的片段并添加了DogListComponent.如果我dog-list在应用程序的某处使用标记,则应查看最后一个片段(浏览器结果).希望它现在有点清晰了.

dog.component.ts

@Component({
    selector: "dog",
    templateUrl: "dog.template.html"
})
class DogComponent
{
    @Input() image: string;
}

dog.template.html

dog_list.component.ts

@Component({
    selector: "dog-list",
    templateUrl: "dog-list.template.html"
})
class DogListComponent
{
}

狗list.template.html

    
        
This is Garry!
    
    
        He is my favorite dog!
    


    
        
My little Linda :)
    
    
        She is my cutest dog!
    


    
        
And here is Rex!
    
    
        DANGEROUS!
    

浏览器结果:

    
        
            
This is Garry!
        
        
            He is my favorite dog!
        
    

    
        
            
My little Linda :)
        
        
            She is my cutest dog!
        
    

    
        
            
And here is Rex!
        
        
            DANGEROUS!
        
    

be-ndee.. 7

所以我找到了解决方案!我需要用.

dog.template.html看起来像这样:

然后它将插入指定的-tags和-tags我的div.

所以我找到了解决方案!我需要用.

dog.template.html看起来像这样:

然后它将插入指定的-tags和-tags我的div.