版本：v6

将照片保存到文件系统

现在，我们能够拍摄多张照片，并在我们应用程序的第二个标签上的照片库中显示它们。但是，这些照片目前尚未永久存储，因此，当关闭应用程序时，它们将被删除。

文件系统API

幸运的是，将它们保存到文件系统只需要几步。首先创建一个新的类方法，保存图片（），在里面照相服务班级（src/app/services/photo.service.ts）。我们通过照片对象，代表新捕获的设备照片：

私人的异步保存图片（（照片：照片）{}

我们可以立即使用此新方法AddNewTogallery（）：

上市异步addNewTogallery（（）{
// 拍张照片
const捕获=等待相机。getphoto（（{
结果类型：摄影。Uri，，，，//基于文件的数据；提供最佳性能
资源：摄影师。相机，，，，//与相机自动拍摄新照片
质量：100//最高质量（0至100）
}）;

//保存图片并将其添加到照片集中
constSavedImageFile=等待这。保存图片（（捕获）;
这。相片。解开（（SavedImageFile）;
}

我们将使用电容器文件系统API将照片保存到文件系统。首先，将照片转换为base64格式，然后将数据馈送到文件系统的writefile功能。您会记得的，我们通过设置每个图像的源路径来在屏幕上显示每张照片（src属性）intab2.page.html到WebViewPath属性。因此，设置它，然后返回新的照片对象。

私人的异步保存图片（（照片：照片）{
//将照片转换为基本64格式，文件系统API要求保存
constbase64data=等待这。READASBASE64（（照片）;

//将文件写入数据目录
const文件名=新的日期（（）。GetTime（（）+'.jpeg';
constSavedfile=等待文件系统。writefile（（{
小路：文件名，，，，
数据：base64data，，，，
目录：目录。数据
}）;

//使用WebPath显示新图像，而不是Base64，因为它是
//已经加载到内存中
返回{
文件路径：文件名，，，，
WebViewPath：照片。WebPath
};
}

READASBASE64（）是我们接下来定义的辅助功能。通过单独的方法组织组织很有用，因为它需要少量的平台特定（Web vs. Mobile）逻辑 - 更多地详细介绍。目前，实现在网络上运行的逻辑：

私人的异步READASBASE64（（照片：照片）{
//获取照片，读为斑点，然后转换为base64格式
const回复=等待拿来（（照片。WebPath呢）;
const斑点=等待回复。斑点（（）;

返回等待这。convertblobtobase64（（斑点）作为细绳;
}

私人的convertblobtobase64=（（斑点：斑点）=>新的承诺（（（（解决，，，，拒绝）=>{
const读者=新的FileReader（（）;
读者。Onerror=拒绝;
读者。负载=（（）=>{
解决（（读者。结果）;
};
读者。Readasdataurl（（斑点）;
}）;

以网络上的base64格式获取相机照片似乎比移动设备上的棘手更棘手。实际上，我们只是使用内置的Web API：拿来（）作为将文件读为blob格式的整洁方法，然后是fileReader的readasdataurl（）将照片斑点转换为base64。

我们去！每次拍摄新照片时，现在都会自动保存到文件系统中。

文件系统API

内容