复选框开关未侦听

Question

我在AngularJS应用程序中使用复选框开关。它们依赖于jQuery，显然不适合Angular，但我不得不使用包含它们的UIKit。

多亏了这个网站上的人的帮助，我找到了一个半工作的解决方案，但仍然缺少一些东西来让开关监听实际复选框的当前值。

我在一个现有的plunker中举了一个例子。您可以在"联系人和帮助"（Help.html）中找到它，控制器名称为HelpController。

我现在要做的是从JS中将checkbox/switch的值设置为"true"，这样我就可以从数据库加载checkbox/开关的保存状态。

有什么解决办法吗？谢谢

Plunker:http://embed.plnkr.co/LRSGXqxjtbYcr6rjTj69/

Answer 1

一些评论：

在你的控制器上，你会得到复选框的初始设置：

app.controller('HelpController', function ($scope) {
   $scope.theCheckbox = true; //in here you would set theCheckbox variable from your DB
   ....
 });

然后将初始值传递给指令，注意属性名称switch-variable（指令的大小写为Camel）：

<div class="switch" init-switch switch-variable="theCheckbox">
  <input type="checkbox" id="active" name="active">
</div>

最后是指令：

 scope.$evalAsync(function () {
   element.switch(); //initialize the plugin
   if(scope.switchVariable)
      element.switch("toggleState");
 });