如何在Angular 2中封装动态添加的元素？

试图让MDL与Angular2一起工作

使用shadowdom封装了从代码中获得的所有css和html。但是当我使用

componentHandler.upgradeElement（）

时，它会创建没有封装的新元素

---

我该怎么做才能把它也封装起来

添加这个简单的指令mdl元素

import {Component, ElementRef } from 'angular2/core';
declare var componentHandler: any;


@Component({
    selector: '[mdl]',
    template: `<ng-content></ng-content>`
})



    export class MdlComponent {

    constructor(public el: ElementRef) {

        MdlComponent.mdlWrapper(el);

    }

    static mdlWrapper(element: ElementRef) {

        componentHandler.upgradeElement(element.nativeElement);
    }
}

从'angular2/core'导入{Component，ElementRef}；
声明var componentHandler:any；
@组成部分({
选择器：“[mdl]”，
模板：``
})
导出类MdlComponent{
建造商（公共el:ElementRef）{
MdlComponent.mdlWrapper（el）；
}
静态mdlWrapper（元素：ElementRef）{
componentHandler.upgradeElement（element.nativeElement）；
}
}