如何使用离子电容器将事件添加到移动设备的日历中

问题描述 投票:0回答:3

我正在开发一个将列出事件的移动应用程序项目。正如我在标题中提到的,我在我的项目中使用离子电容器。我做了很多研究,但找不到任何可以访问 ios 和 android 日历应用程序的插件。简而言之,我想要做的是,当单击应用程序上的按钮时,将该事件保存在手机的日历上。如果有人对这个问题有想法或之前使用离子电容器做过此操作并且可以提供帮助,我会很感激的。谢谢!

ionic-framework capacitor ionic-native capacitor-plugin
3个回答
2
投票

我会分享我的经验,尽管我对这个话题也是新手。

我已经从科尔多瓦迁移到电容器,到目前为止,我无法再次发生这种情况(将事件添加到设备日历)。 @NajamUsSaqib 在文档中建议的插件在这种情况下不起作用,至少对我来说不起作用。

为了绕过这个问题,我所做的就是使用 java 创建一个 ICS,这是我的后端,并使用这个 ICS 向用户发送邮件。为了触发这个,我添加了一个共享功能,可以将其发送给他想要的任何人(如下图所示)。在日历事件本身内,他可以向自己发送一条通知,以使其更容易。

话虽如此,您必须注意发送邀请的类型。

Gmail、Office 365 和 Outlook 可以将事件直接从邮件本身添加到日历中,有一个自动生成的链接,但对于其他日历,用户必须下载 ICS 本身,然后添加它。

对于应用程序来说,这不是一个简洁的解决方案,但到目前为止,这对我来说是最好的解决方案。

有关 ICS 的更多信息以及如何发送电子邮件链接,如果您有兴趣,可以查看 litmus 的这篇文章,我认为这篇文章写得很好。

祝你好运,朋友


1
投票

在 Ionic >= 5 和 Capacitor 3 上,您需要在 app.module.ts 中导入日历,如下所示:

import {Calendar} from '@ionic-native/calendar/ngx';

并不像 @ionic-native/calendar 的文档中所写的那样

此后,您可以将日历添加到您的 app.module.ts 提供程序中,并将日历注入任何 *.ts 文件中,您需要再次从 @ionic-native/calendar/ngx 导入它。

更新

日历现在托管在以下库中 -> @awesome-cordova-plugins/calendar/ngx


0
投票

如果找到了一个干净的转变,可以让我摆脱访问手机本机日历的负担;只需生成 .ics(事件)并打开它即可。

import * as ics from 'ics'
import { FileOpener } from '@capawesome-team/capacitor-file-opener';
import * as capfs from '@capacitor/filesystem';

export const setCalendarEvent = async (startDate, endDate, title, description) => {
    let event = await awaitableICSEvent(startDate, endDate, title, description);
    let blob = new Blob([event], { type: "text/plain;charset=utf-8" });
    let file = new File([blob], "event.ics", { type: "text/plain;charset=utf-8" });
    let b64 = await fileToBase64(file);
    let sysFile = await capfs.Filesystem.writeFile({
        path: 'event.ics', directory: capfs.Directory.Cache, data: b64
    })
    await FileOpener.openFile({
        path: sysFile.uri
    })
}

const awaitableICSEvent = (startDate, endDate, title, description) => new Promise((rs, rj) => {
    let event = {
        start: getDateTimeArray(startDate),
        end: getDateTimeArray(endDate),
        title: title + 'ssssssss',
        description,

    }
    ics.createEvent(event, (error, value) => {
        if (error) {
            rj(error)
        }
        console.log(value)
        rs(value);


    });

})

此行

await FileOpener.openFile({path: sysFile.uri})
将打开本机日历屏幕对话框并允许您保存事件。 还值得查看 ics 对象构造函数,它包含除标题、描述和开始/结束时间之外的许多事件功能。

© www.soinside.com 2019 - 2024. All rights reserved.