创建可以显示内部HTML的AngularDart组件

我一直在试图创建一个组件用于说明目的，它可以在AngularDart本身处理它之前显示它自己的内部HTML标记，例如，如果我写创建可以显示内部HTML的AngularDart组件

<view-source> 
    <h1 ng-if="foo == 1">{{bar}}</h1> 
</view-source>

我想要在正常呈现的h1下显示实际标记。我尝试下面的代码：

@NgComponent(
    selector: 'view-source', 
    templateUrl: 'view-source.html', 
    publishAs: 'self' 
) 
class ViewSource { 
    var template; 
    ViewSource(dom.Element element) : template = element.innerHtml; 
}

<!-- view-source.html --> 
<div> 
    <div class="rendered"> 
    <content></content> 
    </div> 
    <div class="template"> 
    {{self.template}} 
    </div> 
</div>

这适用于简单的情况，但如果里面的东西<view-source>通过transclusion编译，所以不是h1与ng-if它会显示这是行不通的。

我试图通过阅读AngularDart来源找到一个解决方案，但是我可以找到任何解决方案，所以我最终修补了AngularDart以将模板克隆附加到它插入的每个锚点，以便稍后我可以提取它并重新拼接。可以看到一个demo。

我不知道是否有没有补丁AngularDart干净的解决方案。

来源

2014-02-06 Vyacheslav Egorov

我能够使用你的例子，因为它只是一个简单的文本innerhtml获取。 – curt

@curt是的它适用于简单的东西，不适用于复杂的事情。自那以后我没有重新讨论过这个问题。也许在Angular2中有一个明确的解决方案。 –