angularjs实现行事历

好久没写博客了，今天做完了公司的行事历，决定静下来总结一下，虽然不难，但是也花了好几天时间。

简单说一下实现的功能：
1.当月的日历，按照星期排列，每星期七天，不满的留空
2.显示农历二十四节气，包括节假日
3.不同的类型显示不同的背景颜色，如补班为黄色，休假为紫色等
4.每一天都应该再对应的周次内
5.鼠标悬浮显示当天的注意事项
6.双击弹出模态框，可以修改保存注意事项

大体思路为：拿到后台的数据后，先遍历，生成一个只含有周数的数组；
然后ng-repeat生成行，再在行里ng-repeat生成列，让行的周数和列的周数相等的日期显示就可以了；再根据属性加内容和颜色；最后用$modal生成模态框，数据绑定一下；点击保存传入绑定的数据。
数据格式大致为[{date:1,color:”red”…},{}…,{}…]
下面是html代码：

<div class="row" style="font-size:12px;">
                        <div class="col-md-12">
                            <table class="table table-bordered" style="table-layout:fixed;">
                                <caption class="text-center" style="background:#d9edf7;font-weight:900;color:black;" >二月行事历</caption>
                                <thead>
                                    <tr>
                                        <th>Week</th>
                                        <th>Sun</th>
                                        <th>Mon</th>
                                        <th>Tue</th>
                                        <th>Wed</th>
                                        <th>Thu</th>  
                                        <th>Fri</th>   
                                        <th>Sat</th>
                                    </tr>
                                </thead>
                                <tbody style="text-align:center;">
                                    <tr ng-repeat="week in layoutVm.calendarWeeks">
                                        <td  style="background:#d9edf7;">
                                            {
   {
   week}}
                                        </td>
                                        <td style="background:{
   {
   item.DateColor}};padding-left:0;padding-right:0;" ng-repeat="item in layoutVm.calendarDatas"
                                             ng-show="item.YearWeekNumber=={
   {
   week}}"  title="{
   {
   item.tips}}" ng-dblclick="operate.editItem(item)">