angularjs - 如何在开关关闭且开关开启时禁用标签？

Question

嗨，当开关关闭时，标签应该是灰色的，就像标签应该禁用一样，如果打开，那么标签应该启用使用 Angular

这里 fiddle :http://jsfiddle.net/dgj7s5sk/8/

 <label>check1</label>
  <div class="onoffswitch">
 <input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" 
  checked="checked" />
<label class="onoffswitch-label" for="myonoffswitch"> <span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>

</label>
</div>
  <label>check2</label>
  <div class="onoffswitch">
<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch2"  />
<label class="onoffswitch-label" for="myonoffswitch2"> <span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>

</label>
</div>

请我在这个问题上。谢谢

Answer 1

这是更新的 fiddle with solution.

在您的示例中，您没有将代码声明为 Angular 应用。

我做了什么:

1. 使用 Angular 框架(参见左侧“框架和扩展”下的第一个下拉列表)
2. 声明为有 Angular 的应用程序。参见 <div ng-app>在第一行。
3. 已定义 ng-model对于两个输入 switches.switch1和 switches.switch2 .
4. 为禁用标签定义了一个新类

.disabled-class {
color:gray;
}

1. 使用 ng-class 应用条件类

<label ng-class="(switches.switch1)?'':'disabled-class'">check1</label>

<label ng-class="(switches.switch2)?'':'disabled-class'">check2</label>