什么是使用的用户界面，日历Urigo的角流星的正确方法？ [英] What is the correct way to use ui-calendar with Urigo's angular-meteor?

问题描述

我想使用的用户界面，日历Urigo的角流星。我code这个样子，这是行不通的，但我不知道为什么，以及如何解决它。
该集合不为空，但事件不会出现在日历。感谢您的关注。
https://github.com/wuxianliang/ui-calendar-angular-meteor

  CalEvents =新Mongo.Collection（calevents）;
CalEvents.allow（{
    插入：功能（）{
        返回true;
    }，
    更新：功能（）{
        返回true;
    }，
    删除：功能（）{
        返回true;
    }
}）;如果（Meteor.isClient）{angular.module（'Calendardemo'，['角流星'，'ui.calendar'，'ui.router'，'angularMoment'，'mgcrea.ngStrap'，'ngAnimate']）;Meteor.startup（函数（）{
    angular.bootstrap（文件，['Calendardemo']）;
}）;angular.module（'Calendardemo'）。控制器（'MyCalendar'，[
    '$范围'，
    '$集，
    功能（$范围，收集$）{
        $集合（CalEvents）.bind（$范围，calevents'，真正的，真实的）;
        $ scope.addCalEvent =功能（日期，jsEvent，视图）{
            VAR的startDateTime =时刻（日期）.format（'YYYY-MM-DDTHH：MM：ss.SSSZ'）;
            VAR endDateTime =时刻（日期）。新增（1，'H'）格式（YYYY-MM-DDTHH：MM：ss.SSSZ'）。
            $ scope.calevents.push（{
                标题：新事件，
                启动：的startDateTime，
                结束：endDateTime，
                完成：空，
                这样做的：空
            }）        };
        $ scope.eventRender =功能（事件，元素）{};
        / *配置对象* /
        $ scope.uiConfig = {
            日历：{
                高度：450，
                默认视图：'月'，
                郎咸平：'恩'，
                eventColor：灰色，
                标题：{
                    左：'$ P $光伏下一今天，
                    中心：'标题'，
                    右：一个月agendaWeek
                }，
                dayClick：$ scope.addCalEvent，
                eventRender：$ scope.eventRender，
                编辑：真的，
                可选：真实，
                allDayDefault：假的
            }
        };
        $ scope.eventSources = [$ scope.calevents];
    }]）;}
如果（Meteor.isServer）{
    Meteor.publish（'calevents'，函数（）{
        返回CalEvents.find（）;
    }）
}
 

解决方案

您应该使用这个包：
https://github.com/netanelgilad/meteor-angular-ui-calendar

这包包装角UI的日历流星。

这可能不会更新，所以你可以打开里面

的问题

修改的

您可能也想看看这个包看起来更更新：
https://atmospherejs.com/planettraining/angular-ui-calendar

I want to use ui-calendar with Urigo's angular-meteor. I code like this, it doesn't work but I don't know why and how to fix it. The collection is not empty but event do not appear in calendar. Thank you for attention. https://github.com/wuxianliang/ui-calendar-angular-meteor

CalEvents = new Mongo.Collection("calevents");
CalEvents.allow({
    insert: function () {
        return true;
    },
    update: function () {
        return true;
    },
    remove: function () {
        return true;
    }
});

if (Meteor.isClient) {

angular.module('Calendardemo', ['angular-meteor', 'ui.calendar','ui.router', 'angularMoment','mgcrea.ngStrap','ngAnimate']);

Meteor.startup(function() {
    angular.bootstrap(document, ['Calendardemo']);
});

angular.module('Calendardemo').controller('MyCalendar', [
    '$scope',
    '$collection',
    function($scope, $collection) {
        $collection(CalEvents).bind($scope,'calevents',true,true);


        $scope.addCalEvent=function(date, jsEvent, view){
            var startDateTime = moment(date).format('YYYY-MM-DDTHH:mm:ss.SSSZ');
            var endDateTime = moment(date).add(1, 'h').format('YYYY-MM-DDTHH:mm:ss.SSSZ');
            $scope.calevents.push({
                title: 'New Event',
                start: startDateTime,
                end: endDateTime,
                completed: null,
                doing: null
            })

        };
        $scope.eventRender = function(event,element){};
        /* config object */
        $scope.uiConfig = {
            calendar:{
                height: 450,
                defaultView: 'month',
                lang: 'en',
                eventColor: 'grey',
                header:{
                    left: 'prev next today',
                    center: 'title',
                    right: 'month agendaWeek'
                },
                dayClick: $scope.addCalEvent,
                eventRender: $scope.eventRender,
                editable: true,
                selectable: true,
                allDayDefault: false
            }
        };
        $scope.eventSources = [$scope.calevents];
    }]);}
if (Meteor.isServer) {
    Meteor.publish('calevents', function(){
        return CalEvents.find();
    })
}    

解决方案

You should use this package: https://github.com/netanelgilad/meteor-angular-ui-calendar

This package wraps angular-ui-calendar for Meteor.

It might not updated so you can open an issue inside

EDIT

You might also want to check out this package that looks more updated: https://atmospherejs.com/planettraining/angular-ui-calendar

这篇关于什么是使用的用户界面，日历Urigo的角流星的正确方法？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！