用法 <content> 在angular.dart組件？

Question

這個答案中提到的方法： https ： //stackoverflow.com/a/19818178/194642似乎不再起作用了。 如何在angular.dart組件中使用Web組件的元素？

@Component(
selector: "custom-elem",
template: "<div id='container-elem'> <content></content></div>")
class CustomElem extends ShadowRootAware{
  onShadowRoot(_) {
    //do something
  }
}

現在，我希望以下html片段：

<custom-elem> 
  <span>Sample content</span>
</custom-elem> 

導致在#shadow-root中跟隨：

<div id='container-elem'>
  <content> 
    <span>Sample content</span>
  </content>
</div>

Answer 1

我不確定我是否理解您的問題或您的預期結果，但<content>標簽的工作方式是<span>Sample content</span>是<custom-elem> ，其中<div id='container-elem'>放在的陰影DOM <custom-elem>的孩子和之前 </div>中的影子DOM <custom-elem>的孩子，但在之后 <span>在光明DOM喜歡它會當使用像

<div> 
  <span>Sample content</span>
</div> 

當您檢查<custom-elem>的Shadow DOM時，應該只有Angular組件的template部分。