具有 Ionic 3 延迟加载的本机存储模块



在我的 Ionic 3 应用程序上有大约 10 个页面,我已经实现了延迟加载功能。现在我有一个关于本机存储模块的问题。我是否需要将其导入app.module.ts文件中,或者如果我将它导入每个页面的模块可以吗?推荐的使用方法是什么,当然还有最佳实践?

app.module.ts

@NgModule({
declarations: [
MyApp,
],
imports: [
IonicStorageModule.forRoot(),
],

就像您在文档中看到的那样,使用存储的推荐方法是将其添加到AppModule

接下来,将其添加到 NgModule 声明中的导入列表中(对于 例如,在 src/app/app.module.ts 中(:

import { IonicStorageModule } from '@ionic/storage';
@NgModule({
declarations: [
// ...
],
imports: [      
BrowserModule,
IonicModule.forRoot(MyApp),
IonicStorageModule.forRoot()
],
bootstrap: [IonicApp],
entryComponents: [
// ...
],
providers: [
// ...
]
})
export class AppModule {}

然后

最后,将其注入到您的任何组件或页面中:

import { Storage } from '@ionic/storage';
export class MyApp {
constructor(private storage: Storage) { }
...
// set a key/value
storage.set('name', 'Max');
// Or to get a key/value pair
storage.get('age').then((val) => {
console.log('Your age is', val);
});
}

如果您不想这样做,并且更喜欢将其添加到每个页面的模块中,则每个模块将使用存储的新实例,但由于数据存储在整个应用程序的同一位置,我想结果看起来是一样的,但我建议将其从app.component.ts添加到AppModule中,以便在整个应用程序


更新

就像你在 Angular 文档中看到的那样:

为什么延迟加载模块中提供的服务仅对该模块可见?

与启动时加载的模块的提供者不同,提供者 延迟加载的模块是模块范围的。

当 Angular 路由器延迟加载模块时,它会创建一个新的 执行上下文。该上下文有自己的注入器,它是一个 应用程序注入器的直接子级

路由器添加惰性模块的提供程序及其提供程序 将模块导入到此子注射器。

这些提供程序不受应用程序提供程序更改的影响 使用相同的查找令牌。当路由器在 延迟加载上下文,Angular 首选创建的服务实例 从这些提供程序到应用程序根目录的服务实例 注射器。

使用时这可能不那么容易看到Storage,因为数据存储在同一个地方(下面的存储引擎(,但让我们认为我们要注入一个包含public status: boolean属性的StatusProvider

由于您使用的是延迟加载的模块(并且每个模块都有自己的执行上下文(,因此如果将StatusProvider包含在AppModuleproviders数组中(在app.module.ts文件中(,因此将在整个应用中使用相同的StatusProvider实例。因此,如果更改应用中某处的status属性,然后其他模块中的另一个组件尝试读取该值,它将看到更新的值,因为同一实例在整个应用中共享。

相反,如果将StatusProvider添加到每个子模块的providers数组中,并且由于每个子模块都有自己的执行上下文,因此每个子模块都有自己的StatusProvider副本。因此,如果您尝试修改一个子模块内的status属性,则该更改不会在其他(延迟加载(子模块中看到。

相关内容

  • 没有找到相关文章

最新更新