Question

我需要动态地制作当天不同的插槽 -

周一

插槽1：上午9:00 - 上午11:00 插槽2：下午2:00 - 4：00Pm 第3个时段：下午6:00 - 晚上11:00
星期二

插槽1：上午10:00 - 上午11:00 插槽2：下午1:00 - 5:00 插槽3：晚上7:00 - 晚上11:00
星期五

插槽1：上午8:00 - 上午11:00 插槽2：中午12:00 - 下午1:00 插槽3：下午3:00 - 4：00Pm 插槽4：晚上9:00 - 晚上11:00

这里几天的可用天数是灵活的，并且插槽的数量以及插槽的时间也是动态的。我需要一个合适的数据结构来存储这些变量，以便我可以在Angularjs中实现它。我应该为每个使用数组，或者可能有更好的方法来实现它。

我曾尝试将数组用作

[ "available days": {"Monday":["Slot 1: 9:00AM - 11:00AM", "Slot 2: 2:00PM - 4:00Pm", "Slot 3: 6:00PM - 11:00PM"]}, 
{"Tuesday":["Slot 1: 10:00AM - 11:00AM", "Slot 2: 1:00PM - 5:00Pm", "Slot 3: 7:00PM - 11:00PM"]},
 {"Friday":["Slot 1: 8:00AM - 11:00AM", "Slot 2: 12:00PM- 1:00PM", "Slot 3: 3:00PM - 4:00Pm", "Slot 4: 9:00PM - 11:00PM"]}]

Answer 1

非常简单。将JSON作为控制器中的列表获取，并将其分配给$ scope，这只是ng-model之类的，

$scope.slots=[ "available days": {"Monday":["Slot 1: 9:00AM - 11:00AM", 
 "Slot 2: 2:00PM - 4:00Pm", "Slot 3: 6:00PM - 11:00PM"]},
    {"Tuesday":["Slot 1: 10:00AM - 11:00AM", "Slot 2: 1:00PM - 5:00Pm", "Slot 3: 7:00PM - 11:00PM"]},
   {"Friday":["Slot 1: 8:00AM - 11:00AM", "Slot 2: 12:00PM- 1:00PM", "Slot 3: 3:00PM - 4:00Pm", "Slot 4: 9:00PM - 11:00PM"]}];

现在根据日期格式的当前时间逐个获取对象。稍后使用angulat.forEach（）condition

检查数组中插槽的名称

angular.forEach($scope.slots,function(list){
// code goes here....
})

现在检查条件并将其作为ng-model分配给另一个$ scope，并在html中将ng-repeat分配给特定的条件列表。

注意：您必须将ng-repeat列表作为

ng-repeat="item in slotlist.available days"

此处插槽列表是您新分配的ng-model，可用天数是您可以获得数据的数组。

在Angularjs动态制作Day的插槽

1 个答案: