How-To：リピータの角度/ブートストラップbtn-checkboxを作成

Question

各行に4列のボタンがあるグリッド（ng-repeatを持つテーブル）を作成しようとしています。理想的には、角度/ブートストラップbtn-チェックボックスなどのチェックボックスがオン/オフモードになるようにすることが理想的です。このモードは、データベースページのデータから設定します。 。

私がいる問題は、私は本当に/適用保存]ボタンをクリックますときに私controllers.jsのものBTN-チェックボックスコントロールの状態を確認する方法がわからないということですので、私値を保存することができます。

Answer 1

どうやってこのようにしますか？

私は$ scope.buttons内でスコープ変数を作成するためにevalを使用しています。

http://jsfiddle.net/tekmtn/dnfhnLex/3/

app = angular.module('myApp', ['ui.bootstrap']); 
app.controller("myController", function($scope) { 
    $scope.records = [1,2,3,4]; 
    $scope.buttonSets = [1,2,3,4]; 
    $scope.buttonsPerSet = ["Added", "Changed", "Closed"]; 

    $scope.buttons = {}; 

    $scope.toggleButton = function(recNum, setNum, btnText) { 
    var field = "$scope.buttons." + "btnRec" + recNum + "_setNum_" + setNum + "_" + btnText; 
    var value = eval(field); 
    if(!value) { 
     eval(field + " = 1;"); 
    } else { 
     eval(field + " = 0;"); 
    } 
    } 

    $scope.isActive = function(recNum, setNum, btnText) { 
    var field = "$scope.buttons." + "btnRec" + recNum + "_setNum_" + setNum + "_" + btnText; 
    var value = eval(field); 
    if(value == 1) { 
     return true; 
    } else { 
     return false; 
    } 
    } 

    $scope.save = function() { 
    // send $scope.buttons through web service. 
    } 
}); 


<div ng-app="myApp"> 
    <div ng-controller="myController"> 
     <table class='table table-striped'> 
      <thead> 
      <tr> 
      <th>Record</th> 
      <th ng-repeat="setNum in buttonSets"> 
      Button Set {{setNum}} 
      </th> 
     </tr> 
     </thead> 
     <tbody> 
     <tr ng-repeat="recNum in records"> 
      <td>Record {{recNum}}</td> 
      <td ng-repeat="setNum in buttonSets"> 
      <button ng-repeat="btnText in buttonsPerSet" class='btn btn-default btn-xs' type='button' uib-btn-checkbox btn-checkbox-true="1" btn-checkbox-false="0" ng-click="toggleButton(recNum, setNum, btnText);" ng-class="{'active':isActive(recNum, setNum, btnText)}"> 
       {{btnText}} 
      </button> 
      </td> 
     </tr> 
     </tbody> 
    </table> 

    {{buttons}} 
    <br /><br /> 
    <button type='button' class='btn btn-default'>Cancel</button> 
    <button type='button' class='btn btn-default'>Apply</button> 
    <button type='button' class='btn btn-default'>Save</button> 
</div>