位置: 编程技术 - 正文

angular中ui calendar的一些使用心得(推荐)

编辑：rootadmin

推荐整理分享angular中ui calendar的一些使用心得(推荐)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助，希望把文章链接给更多的朋友！

ui calendar是封装fullcalendar的一款angular指令插件

官方地址：和ui calendar包安装我就不介绍了。自行百度下。

包安装好后，添加路径引用

本次开发环境angular1.x

调用

在controller中配置参数

这是一些基础配置，其他的请根据需求配置

下面来谈谈我在使用中遇到的一些问题，首先要从需求开始：

1.产品需求：每天事件要按字段“x”排序。

2.要根据月筛选查看不同月的视图数据。

首先来解决第一个问题，查看fullcalendar有没有排序功能，中文百度了半天，好吧，放弃了。。。用英文搜索，终于找到，在新版的fullcalendar提供了排序字段，默认是‘title';于是重新安装了fullcalendar,手动设置排序方法：在数据集中增加自定义排序字段，如{title:'',sort:''},然后在$scope.urConfig.calendar中添加eventOrder:'sort'就可以了，很开心,第一个问题解决了！

第2个问题，根据时间查看不同月份视图,往eventSources里扔不同月份的数据集合不就行了？试了一下，额，视图不变化。。。又开始了英文搜索之旅。。。终于找到了一个帖子，方法如下：

1.在controller中注入uiCalendarConfig，然后uiCalendarConfig.calendars.myCalendar.fullCalendar('gotoDate', calendarMonth);calendarMonth是需要加载显示的月份，但是调用之后uiCalendarConfig.calendars.myCalendar is undefined...

解决方法：

到了这一步，项目要求的基本功能够已实现了。

开始优化：

1.把显示界面调成中文, 在配置config中添加lang:'zh-cn'或locale:'zh-cn',如果还不行，请升级你的ui calendar包

2.视图加载很缓慢,又英文搜索了很长时间。。。吐槽一下。国人没遇到过这类问题吗，中文搜索根本搜不到。。。，最后看到一个帖子：

将$scope.eventSources = [$scope.events];改成$scope.eventSources = []，

$scope.events通过请求返回接收后uiCalendarConfig.calendars.myCalendar.fullCalendar('addEventSource', $scope.events);加载，试了一下。nice,缓慢问题搞定。。。但是新问题来了，视图不会把我上次的数据清除，会造成重复数据！

最后换成了$scope.eventSources.push($scope.events);虽然也解决了问题，但是上面的问题并没有解惑。。。欢迎高手指点！

以上是我在使用过程中遇到的一些问题。。。希望能帮到同样遇到问题的朋友们！自己记录一下，以备后用！

这篇angular中ui calendar的一些使用心得(推荐)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持积木网。

关于Vue背景图打包之后访问路径错误问题的解决案例环境通过vue-cli脚手架创建的vue项目在项目打包的时候遇到了背景图片路径出错的问题，经过谷歌一番，发现是在配置的时候对图片的限制大小过小

Angular4绑定html内容出现警告的处理方法前言众所周知在Web前端开发中，我们经常会遇见需要动态的将一些来自后端或者是动态拼接的HTML字符串绑定到页面DOM显示，特别是在内容管理系统（CMS

vue中使用localstorage来存储页面信息今天小颖在跟着慕课网学习vue，不学不知道，一学吓一跳，学了才发现，我之前知道的只是vue的冰山一角，嘻嘻，今天把小颖跟着慕课网学习的demo，给

标签: angular中ui calendar的一些使用心得(推荐)

本文链接地址:https://www.jiuchutong.com/biancheng/375858.html 转载请保留说明！

上一篇：AngularJS中controller控制器继承的使用方法

下一篇：关于Vue背景图打包之后访问路径错误问题的解决(vue设置背景图片全屏)