如何样式化ng-content，::ng-deep不起作用

Question

我正在尝试在anuglar2中对<ng-content>中的内容进行样式设置

<au-fa-input >
   <input type="text" class="form-control" placeholder="email" #input>
 </au-fa-input>

在au-fa-input组件中我尝试了css

  :host /deep/ input{
   display:none
  }

或

::ng-deep input{
   display:none
  }

但这并不管用

Answer 1

我认为/deep/不会直接应用于ng-content和ng-template，例如，它适用于嵌套组件，因此您必须创建一个包含您元素的类的div，并尝试如下所示：

<ng-content>
   <div class="deepClass">
     <au-fa-input >
         <input type="text" class="form-control" placeholder="email" #input>
     </au-fa-input>
   </div>
</ng-content>

和css

.deepClass /deep/ input {
   display:none
}