小编Eth*_*man的帖子

每次我刷新页面时，Google Chrome Dev Tools 都会切换到 Sources 选项卡，这很烦人。没有断点，也没有错误，所以向我展示随机源文件是非常无用且令人讨厌的。它并不总是对所有网站都这样做。如果我选择了控制台选项卡，如何在刷新时强制它留在控制台上？（67.0.3396.99（官方版本）（64 位））

更新：

正确的问题可能是：“我如何实现自己的版本，ng-container因此可以使用“ <my-component ...>...</my-component>”代替“ <ng-container my-directive ...>...</ng-container>”。

我正在Angular 4中开发一个新应用程序。我想使用包装器组件构建整个应用程序，以便在需要时可以换出实际组件。这对于简单的控件很容易工作，但对于我们想要分解为单独的组件的复杂控件则不行。最好的示例是选项卡，因为需求相当稳定：带有标签和我们显示/隐藏的内容面板的选项卡列表。

ng-bootstrap可能会使用以下内容：

<ngb-tabset>
  <ngb-tab title="Tab 1">
    <ng-template ngbTabContent>...</ng-template>
  </ngb-tab>
  ...
 <ngb-tabset>

我们可能还有其他类似的组件：

<div class="my-tab-group">
  <ul>
    <li>Tab 1</li>
    ...
  </ul>
  <div class="my-tab" title="Tab 1">...</div>
  ...
</div>

而不是此时将我的应用绑定到特定的实现，我想定义自己的标签包装器，并在各处使用它，如下所示：

<my-tabs-control>
  <my-tab-control title="Tab 1">...</my-tab-control>
  ...
<my-tabs-control>

然后，如果我需要更改标签的工作方式，那么它会发生在一个地方。但是，如果我们使用包装器组件，则HTML会被宿主元素标签与所需标签交织在一起污染，这显然使事情变得混乱，例如

<my-tabs-control>
  <div class="my-tab-group">
    <ul>
      <li>Tab 1</li>
      ...
    </ul>
    <my-tab-control title="Tab 1">
      <div class="my-tab" title="Tab 1">...</div>
    </my-tab-control>        
    ...
  </div>
<my-tabs-control>

我的猜测是，这就是为什么许多人问如何解开/删除Angular组件中的宿主元素的原因-这将使此操作变得非常简单。

通常的答案是改用属性选择器，例如：

删除angular2组件的选择器标签

如何从HTML中删除/替换angular2组件的选择器标签

但是，这意味着我们需要在使用站点上了解标签结构，这显然破坏了使用命名良好的包装器标签的整个目的。

因此，最后，我应该怎么做？是否可能由于性能原因而无法使用？我已经开始研究Renderer2，但是还没有找到一种明显的方式来做我想做的事，并且我想避免非角度的DOM黑客。

我正在摆弄触摸屏的这个菜单：

不知何故#nav span:after导致跨度上出现向下箭头 - 如何？它从何而来？如何更改此图标/字符？

它似乎不是来自content酒店，而且任何地方都没有图像文件。当我在自己的系统中复制这个时，我也在 IE 和 FF 中得到了箭头。如果我们将nav标签更改为 adiv并且删除aria-haspopup. 如果我在 IE 或 FF 中按 F12，我找不到它来查看它的引入位置，除非它是使用边框或其他东西的一些奇怪的怪癖。

HTML：

<nav id="nav" role="navigation"> 
    <span href="#nav" title="Show navigation">Show navigation</span>
    <span href="#" title="Hide navigation">Hide navigation</span>

    <ul class="clearfix">
        <li><a href="">Home</a>

        </li>
        <li> <a href="" aria-haspopup="true"><span>Blog</span></a>

            <ul>
                <li><a href="">Design</a>

                </li>
                <li><a href="">HTML</a>

                </li>
                <li><a href="">CSS</a>

                </li>
                <li><a href="">JavaScript</a>

                </li>
            </ul>
        </li>
        <li> <a href="" aria-haspopup="true"><span>Work</span></a>

            <ul>
                <li><a href="">Web Design</a>

                </li>
                <li><a href="">Typography</a>

                </li>
                <li><a …