为这个JSON输入数组定义ng模型——AngularJS



目标:我必须使用以下结构放入这些数据:

"open_hours": [ // (See that open_hours is an array).
      {
        "weekday": "mon",
        "opens_at": "09:00",
        "closes_at": "22:00"
      },
      {
        "weekday": "tue",
        "opens_at": "09:00",
        "closes_at": "22:00"
      }
  ]

js:

$scope.days = ["sun","mon","tue","wed","thu","fri","sat"];
$scope.restaurant = {};
$scope.restaurant.open_hours = [];

为了在此模板中查看(angular-bootstrap-ui timePicker指令(:

<div class="row">
      <div class="col-lg-12">
        <table class="table table-striped table-hover table-condensed">
          <tbody ng-repeat="day in days">
            <tr>
              <td>
                <input type="hidden" ng-model="restaurant.open_hours[day].weekday" ng-value="day"/>
                {{day}}
              </td>
              <td>
                Opens at <uib-timepicker ng-model="restaurant.open_hours[day].opens_at" show-meridian="false" show-spinners="false" minute-step="15"></uib-timepicker>
              </td>
              <td>
                Closes at <uib-timepicker ng-model="restaurant.open_hours[day].closes_at" show-meridian="false" show-spinners="false" minute-step="15"></uib-timepicker>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>

怎么做?我所有的尝试都没有成功。

您需要有一个用于填充时间选择器的日期对象。

var time = new Date();
  time.setHours(9);
  time.setMinutes(0);
  var closeTime = new Date();
  closeTime.setHours(22);
  closeTime.setMinutes(0);
  $scope.restaurant = {
    "open_hours": [
  {
    "weekday": "mon",
    "opens_at": time,
    "closes_at": closeTime
  },
  {
    "weekday": "tue",
    "opens_at": time,
    "closes_at": closeTime
  }
]};

这是一个代码笔,显示了一个工作示例。

最新更新