在我的 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
包含在AppModule
的providers
数组中(在app.module.ts
文件中(,因此将在整个应用中使用相同的StatusProvider
实例。因此,如果更改应用中某处的status
属性,然后其他模块中的另一个组件尝试读取该值,它将看到更新的值,因为同一实例在整个应用中共享。
相反,如果将StatusProvider
添加到每个子模块的providers
数组中,并且由于每个子模块都有自己的执行上下文,因此每个子模块都有自己的StatusProvider
副本。因此,如果您尝试修改一个子模块内的status
属性,则该更改不会在其他(延迟加载(子模块中看到。