如何自定义样式angular-bootstrap-toggle？

Question

我在我的库中包含了用于切换的angular-bootstrap-toggle。我也在设置开关值。但标签溢出，并且被切换按钮 - Image 1和Image 2重叠。我想设定自己的风格。根据关于angular-bootstrap-toggle的文档，我们可以添加样式属性。我试过，但我得到一个错误说“：预期”如下所示：

<style> 
     .toggle.ami { 
      width: 80px; 
     } 
     .toggle.ami .toggle-handle{ 
      width: 80px; 
     } 
</style> 

：下

<div> 
    <toggle ng-model="selectedTicket" ng-change="toggleTicket()" on="Ticket" off="Image" style="ami"></toggle> 
</div> 

风格在我的index.html文件中定义的，包括所有的CSS文件，之后我希望有任何建议来帮助我解决这个问题。

Answer 1

，如果你在你的HTML改变“风格”到“类”它应该工作：

<div> 
    <toggle ng-model="selectedTicket" ng-change="toggleTicket()" on="Ticket" off="Image" class="ami"></toggle> 
</div> 

您还需要从.toggle CSS选择器中删除.因为切换是不是一类：

<style> 
    toggle.ami { 
    width: 80px; 
    } 
    toggle.ami .toggle-handle{ 
    width: 80px; 
    } 
</style>