AngularJS 表达式与 StencilJS 中断答案

【问题标题】：AngularJS Expression breaks with StencilJSAngularJS 表达式与 StencilJS 中断
【发布时间】：2019-10-27 05:31:10
【问题描述】：

我有一个使用 StencilJS 创建的自定义选择 Web 组件，我在 AngularJS 中使用它，如下所示：

<my-select>
  <my-option ng-repeat="item in items">
    {{item.value}}
  </my-option>
</my-select>

问题在于，每当我在 items 数组 (items.push({key: 'some', value: 'Some Value'})) 上推送新项目时，表达式似乎也在 DOM 中打印出它自己的语法，如下所示：

这是<my-option> StencilJS 组件结构：

render() {
  return (
    <div class="option-container" onClick={this.selectOption(this)}>
      <slot />
    </div>
  );
}

任何帮助将不胜感激。谢谢。

【问题讨论】：

【解决方案1】：

您是否尝试过一些较新的浏览器，例如最新的 Firefox 或 Chrome？我遇到了一些非常愚蠢的问题，因为例如 Edge 浏览器最初确实将 <slot 标记呈现为字符串，并且只呈现一次 innerHTML。另一个浏览器会将插槽保留为 DOM 元素，使其更具动态性。

【讨论】：