2014-09-19 94 views
1

以下对象的动态数组是数组我想按钮click创建(果)的类型 -无法创建AngularJS

[ 
     {DATE, morning_VALUE, night_VALUE}, 
     {DATE, morning_VALUE, night_VALUE}, 
     {DATE, morning_VALUE, night_VALUE}, 
     {DATE, morning_VALUE, night_VALUE}, 
     {DATE, morning_VALUE, night_VALUE}, 
     {DATE, morning_VALUE, night_VALUE}, 
     {DATE, morning_VALUE, night_VALUE}, 
    ] 
    morning_VALUE -> true/false 
    night_VALUE -> true/false 

以下是我plnkr码 - PLNKR

HTML -

<div class="col-lg-3"> 
    <ul> 
    <li ng-repeat="a in weeklist" style="margin-bottom: 3px;"> 
     <button ng-click="showWeekDays(a[0], a[1])" 
       style="width:178px;" 
       class="btn bg-blue"> 
     {{a[0] | date: 'shortDate'}} - {{a[1] | date: 'shortDate'}} 
     </button> 
    </li> 
    </ul> 
</div> 
<table> 
    <tr ng-repeat-start="a in sevenWeekDayArr"> 
    <td> 
     {{a | date: 'shortDate'}} 
    </td> 
    <td> 
     <input type="hidden" 
      ng-model="avail[$index].currDate" 
      ng-init="avail[$index].currDate = a" /> 
    </td> 
    </tr> 
    <tr> 
    <td>Morning:</td> 
    <td> 
     <input type="checkbox" ng-model="avail[$index].morning" /> 
    </td> 
    </tr> 
    <tr ng-repeat-end=""> 
    <td>Night:</td> 
    <td> 
     <input type="checkbox" ng-model="avail[$index].night" /> 
    </td> 
    </tr> 
</table> 
<div> 
    <button ng-click="addTime(avail)">Click</button> 
</div> 

让我知道我做错了,我相信我需要使用push在这种情况下,但不知道如何适应它在我的情况。

回答

3

您试图将对象绑定到没有特定值的模型对象。

尝试这种在的script.js

$scope.avail.push({currDate: "", morning:false, night:false}); 

这将初始化对象的数组线17后,然后可以修改它,你从视图

所希望的方式
0
<table> 
      <tr ng-repeat-start="a in sevenWeekDayArr"> 
       <td> 
        {{a | date: 'shortDate'}} 
       </td> 
       <td> 
        <input type="hidden" ng-model="a.currDate" /> 
       </td> 
      </tr> 
      <tr> 
       <td>Morning:</td> 
       <td><input type="checkbox" ng-model="a.morning" /></td> 
      </tr> 
      <tr ng-repeat-end=""> 
       <td>Night:</td> 
       <td><input type="checkbox" ng-model="a.night" /></td> 
      </tr> 
</table> 
<div> 
    <button ng-click="addTime()">Click</button> 
</div> 

$scope.addTime = function(){ 
    angular.forEach($scope.sevenWeekDayArr, function(item){ 
     $scope.avail.push(item); 
    }); 
    console.log($scope.avail); 
};