如何使用自定义角度指令包含子元素？

Question

当前HTML

<g class='entity'>
  <rect />
  <circle />
  ...
</g>

新/期望的HTML

<box>
  <rect />
  <circle />
  ...
</box>

简单指令

app.directive('box', ['$document', function ($document) {
    return {
        restrict : 'E',
        replace: true,
        template: "<g class='entity'></g>"
    };
}]);

DOM中的结果

<g class='entity'>... everything missing here ... </g>

我希望子子元素保持不变。

Answer 1

您正在寻找的是所谓的转换。 如果将 transclude：true 添加到指令定义中，则将保留所有子元素。模板将仅覆盖框元素，但保留内部内容。

fn main() {
    let s = "hello".to_string();
    let keywords = vec!["hello", "bye"];

    // if keywords.contains(&s.as_str())
    if keywords.contains(&&s)
    // ~> expected &&str, found &collections::string::String
    {
        println!("exists");
    }
}

}]）;