title: Toggle button with angular ngrepeat
body: <p>I want to make a toggle button of bootstrap but I am facing some issues. Toggle button is not view only check box is displayed and when I remove <code>ngRepeat</code> directive then it work fine only for single button but I need multiple buttons by using <code>ngRepeat</code>. So kindly help me.</p>
  
  <pre><code>&lt;div class="box-body" ng-controller="AutomationController"&gt;
    &lt;div class="table-responsive"&gt;
      &lt;table class="table table-hover "&gt;
        &lt;thead&gt;
          &lt;tr&gt;
            &lt;th&gt;Device Name&lt;/th&gt;
            &lt;th&gt;Status&lt;/th&gt;
            &lt;th&gt;Action&lt;/th&gt;
            &lt;th&gt;Edit Device Name&lt;/th&gt;
          &lt;/tr&gt;
        &lt;/thead&gt;
        &lt;tbody&gt;
          &lt;tr ng-repeat="device in devices"&gt;
            &lt;td&gt;[[device.dname]]&lt;/td&gt;
            &lt;td&gt;
              &lt;span ng-if="device.status===1"&gt;ON&lt;/span&gt;
              &lt;span ng-if="device.status===0"&gt;OFF&lt;/span&gt;
            &lt;/td&gt;
            &lt;td&gt;
              &lt;input type="checkbox" checked data-toggle="toggle" ng-if="device.status===1"&gt;
              &lt;input type="checkbox" checked data-toggle="toggle" ng-if="device.status===0"&gt;
            &lt;/td&gt;
            &lt;td&gt;&lt;a href="#"&gt;&lt;i class="fa fa-pencil-square-o"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
        &lt;/tbody&gt;
      &lt;/table&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>