angular - ionic v4 和社交分享插件
问题描述
我有一个正在工作的自定义组件,我刚刚添加了一个共享按钮。我想让它工作,所以我安装了这个社交分享插件,并按照看似简单的说明进行操作,例如
$ ionic cordova plugin add cordova-plugin-x-socialsharing
$ npm install --save @ionic-native/social-sharing@4
但是,一旦我将所需的服务注入到构造函数中,应用程序就会停止工作,并且在浏览器控制台中出现错误(见下文)。这是我的自定义组件文件中的一个片段,其中.ts
包含我添加到构造函数的导入和属性注入。请注意,只要涉及到这个问题,我已经删除了几个无用的真实代码部分:
import { Component, AfterViewInit, ElementRef, ViewChild} from '@angular/core';
import { PdfParametersService } from '../../services/pdf-parameters.service';
import { UserProfileService } from '../../services/user-profile.service';
import { SocialSharing } from '@ionic-native/social-sharing';
@Component({
selector: 'sollecita',
templateUrl: './sollecita.component.html',
styleUrls: ['./sollecita.component.scss'],
})
export class SollecitaComponent implements AfterViewInit {
constructor(
private socialSharing: SocialSharing, /* THIS LINE TRIGGERS THE PROBLEM */
private service: PdfParametersService,
private profileService: UserProfileService
) {
}
ngAfterViewInit(): void {
}
这是我在浏览器控制台中遇到的错误,仅当将社交共享服务注入构造函数时。如果我注释掉该行,该应用程序将重新开始工作,但它显然缺乏共享功能:
Uncaught (in promise): ReferenceError: Cannot access 'SollecitaPageModule' before initialization
ReferenceError: Cannot access 'SollecitaPageModule' before initialization
at Module.SollecitaPageModule (VM609 pages-sollecita-sollecita-module.js:890)
at VM44 main.js:2141
at ZoneDelegate.invoke (VM37 polyfills.js:3604)
at Object.onInvoke (VM45 vendor.js:79927)
at ZoneDelegate.invoke (VM37 polyfills.js:3603)
at Zone.run (VM37 polyfills.js:3363)
at VM37 polyfills.js:4090
at ZoneDelegate.invokeTask (VM37 polyfills.js:3639)
at Object.onInvokeTask (VM45 vendor.js:79908)
at ZoneDelegate.invokeTask (VM37 polyfills.js:3638)
at Zone.runTask (VM37 polyfills.js:3407)
at drainMicroTaskQueue (VM37 polyfills.js:3809)
at ZoneTask.invokeTask [as invoke] (VM37 polyfills.js:3724)
at invokeTask (VM37 polyfills.js:4835)
at HTMLElement.globalZoneAwareCallback (VM37 polyfills.js:4861)
at resolvePromise (VM37 polyfills.js:4032) [angular]
at resolvePromise (VM37 polyfills.js:3991) [angular]
at :8100/polyfills.js:4093:21 [angular]
at Object.onInvokeTask (VM45 vendor.js:79908) [angular]
at drainMicroTaskQueue (VM37 polyfills.js:3809) [<root>]
at ZoneTask.invokeTask [as invoke] (VM37 polyfills.js:3724) [<root>]
at invokeTask (VM37 polyfills.js:4835) [<root>]
at HTMLElement.globalZoneAwareCallback (VM37 polyfills.js:4861) [<root>]
defaultErrorLogger @ core.js:6014
handleError @ core.js:6066
next @ core.js:40558
schedulerFn @ core.js:35336
__tryOrUnsub @ Subscriber.js:183
next @ Subscriber.js:122
_next @ Subscriber.js:72
next @ Subscriber.js:49
next @ Subject.js:39
emit @ core.js:35298
(anonymous) @ core.js:39738
invoke @ zone-evergreen.js:365
run @ zone-evergreen.js:124
runOutsideAngular @ core.js:39572
onHandleError @ core.js:39735
handleError @ zone-evergreen.js:369
runGuarded @ zone-evergreen.js:137
api.microtaskDrainDone @ zone-evergreen.js:671
drainMicroTaskQueue @ zone-evergreen.js:577
invokeTask @ zone-evergreen.js:485
invokeTask @ zone-evergreen.js:1596
globalZoneAwareCallback @ zone-evergreen.js:1622
这是我的SollecitaPageModule.ts
代码:
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { IonicModule } from '@ionic/angular';
import { SollecitaPageRoutingModule } from './sollecita-routing.module';
import { SollecitaPage } from './sollecita.page';
import { SollecitaComponent } from '../../../components/sollecita/sollecita.component';
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
SollecitaPageRoutingModule
],
declarations: [SollecitaPage, SollecitaComponent]
})
export class SollecitaPageModule {}
我不明白为什么 SollecitaPageModule 会受到组件中共享服务注入的影响。我怀疑罪魁祸首是我导入的方式和/或我在页面模块中声明组件的方式,但是,即使那样,我也不知道为什么,也不知道如何解决它。你能帮忙吗?