AngularJS：我如何在视图中覆盖指令的样式？

Question

我在我的视图中调用error-stuff指令，如下所示，我试图在我的视图中覆盖指令的填充15px到0px，这是无效的。所以我的div1的值和div2的值不是一条直线，因为div2在我看来需要更多的填充。

 Error:
          Oops !!! Its look like something going wrong !!! Please try again later ...


<div id="div1" class="row">
   <div  class="pull-left">
      <span>Error :</span>
   </div>

    <div id="div2" style="padding:0px; vertical-align:top">
        <error-stuff></error-stuff>
    </div>
</div>

error-stuff指令上的html模板如下

<div class="error-class">
   <span>Oops !!! Its look like something going wrong !!! Please try again later 
    ...  </span>
</div>

在我的app.css中

.error-class
{
margin-bottom:20px;
padding:15px;
box-sizing:border-box;
line-height:1.5;
font-size:15px;
}

那么如何通过覆盖指令padding来实现 div1和div2内容：15px到padding：0px？

Answer 1

假设在其他地方使用了error-stuff并且您无法更改全局css，在这种情况下，您可以通过在css中指定父级来使用目标覆盖

#div2 .error-class {
    padding: 0;
}