チェックボックスはモデルで複数選択し、Ngモデルなしではコンパイルされません

Question

ng-repeatは、7つのタブを作成する別のng-repeatの内部にあるチェックボックスを出力します。 。私には2つの問題があります。まず最初に、あるボックスをチェックすると、他のすべてのタブで同じものが選択され、もう一度チェックが外されないことが確認されます。

私がモデルを削除しようとしたが、その後、コードがコンパイルされないだろうと私はまたng-modelの代わりにchecklist-modelとchecklist-valueを使用してみましたが、これはどちらかのコンパイルされませんでした。

チェックボックスのためのHTMLは次のとおりです。

<div class="time-check" ng-repeat="service in settings.services"> 
    <input type="checkbox" value="" ng-change="settings.showChecked($index)" ng-model="settings.rules[$index].checked" class="time-check-input" id="{{level.LevelTmsCode}}-{{day.Day}}-{{service.TimeValidation}}" name="check-{{day.Day}}-{{level.LevelTmsCode}}"/> 
    <label for="{{level.LevelTmsCode}}-{{day.Day}}-{{service.TimeValidation}}" class="time-check-input"></label> <span>{{service.TimeValidation}}</span> 
</div> 

そしてアコーディオンは、タブとボックスがあり、全体を生成JS：

settings.getDeliveryServices = function() { 
    $http.get(resourceBase + "api/service/levels").success(function(data) { 
     settings.serviceLevels = data; 
     // Get Service Days 
     $http.get(resourceBase + "api/service/days").success(function(days) { 
      settings.serviceDays = days; 
      // Build the Accordion 
      setTimeout(() => settings.triggerClick(settings.serviceLevels), 500); 
      $http.get(resourceBase + "api/service/services").success(function (services) { 
       settings.services = services; 
       // Build a collection of all possible rules 
       for (var a = 0; a < settings.serviceLevels.length; a++) { 

    settings.rulesTmsCode.push(settings.serviceLevels[a].LevelTmsCode + "-"); 
       } 
       for (var b = 0; b < settings.serviceDays.length; b++) { 
        settings.rulesDay.push(settings.serviceDays[b].Day + "-"); 
       } 
       for (var c = 0; c < settings.services.length; c++) { 
        settings.rulesTime.push(settings.services[c].TimeValidation); 
       } 
       var allArrays = [settings.rulesTmsCode, settings.rulesDay, settings.rulesTime]; 
       function allPossibleCases(arr) { 
        if (arr.length === 1) { 
         return arr[0]; 
        } else { 
         var result = []; 
         var allCasesOfRest = allPossibleCases(arr.slice(1)); 
         for (var i = 0; i < allCasesOfRest.length; i++) { 
          for (var j = 0; j < arr[0].length; j++) { 
           result.push(arr[0][j] + allCasesOfRest[i]); 
          } 
         } 
         return result; 
        } 
       } 
       var uncheckedRules = allPossibleCases(allArrays); 
       for (var i = 0; i < uncheckedRules.length; i++) { 
        settings.rules.push({ 
         id: uncheckedRules[i], 
         checked: false 
        }); 
       } 
      }); 
     }); 
    }); 
} 

私のエンドポイントはこれらのチェックボックスを持っているだけですロードして、各タブのセットはお互いに分かれています。私がそれらをチェックすると、チェックされたもののリストを取得したいと思います。

Answer 1

ng-modelのダミーオブジェクトを作成すると、1つのチェックボックスのみがチェックされます。

<div class="time-check" ng-repeat="service in settings.services"> 
    <input type="checkbox" value="" ng-change="settings.showChecked($index)" ng-model="newObject[item.name]" class="time-check-input" id="{{level.LevelTmsCode}}-{{day.Day}}-{{service.TimeValidation}}" name="check-{{day.Day}}-{{level.LevelTmsCode}}"/> 
    <label for="{{level.LevelTmsCode}}-{{day.Day}}-{{service.TimeValidation}}" class="time-check-input"></label> <span>{{service.TimeValidation}}</span> 
</div>