проблема с сетевым плагином ionic framework

Я использую ionic 3. Я установил сетевой плагин для проверки сетевого подключения в app.component.ts.

https://ionicframework.com/docs/native/network/

Но когда я использую этот метод, он дает мне ошибку.

core.js:1449 ERROR Error: Uncaught (in promise): TypeError: Object(...) is not a function
TypeError: Object(...) is not a function
    at Network.onDisconnect (index.js:61)
    at app.component.ts:17
    at t.invoke (polyfills.js:3)
    at Object.onInvoke (core.js:4760)
    at t.invoke (polyfills.js:3)
    at r.run (polyfills.js:3)
    at polyfills.js:3
    at t.invokeTask (polyfills.js:3)
    at Object.onInvokeTask (core.js:4751)
    at t.invokeTask (polyfills.js:3)
    at c (polyfills.js:3)
    at polyfills.js:3
    at t.invokeTask (polyfills.js:3)
    at Object.onInvokeTask (core.js:4751)
    at t.invokeTask (polyfills.js:3)
    at r.runTask (polyfills.js:3)
    at o (polyfills.js:3)
    at e.invokeTask [as invoke] (polyfills.js:3)
    at p (polyfills.js:2)
    at HTMLDocument.v (polyfills.js:2)

И код моего app.component.ts

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen,private network: Network) {
    platform.ready().then(() =>
    {
                this.network.onDisconnect().subscribe(() =>
          {
            console.log("onDisconnect");
          });

           this.network.onConnect().subscribe(() =>
           {
             console.log("onConnect");
           });

      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      statusBar.styleDefault();
      splashScreen.hide();
    });
  }

мой пакет.json

{
  "name": "testNetwork1",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": {
    "start": "ionic-app-scripts serve",
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint"
  },
  "dependencies": {
    "@angular/animations": "5.2.11",
    "@angular/common": "5.2.11",
    "@angular/compiler": "5.2.11",
    "@angular/compiler-cli": "5.2.11",
    "@angular/core": "5.2.11",
    "@angular/forms": "5.2.11",
    "@angular/http": "5.2.11",
    "@angular/platform-browser": "5.2.11",
    "@angular/platform-browser-dynamic": "5.2.11",
    "@ionic-native/core": "~4.18.0",
    "@ionic-native/network": "^5.2.0",
    "@ionic-native/splash-screen": "~4.18.0",
    "@ionic-native/status-bar": "~4.18.0",
    "@ionic/pro": "2.0.4",
    "@ionic/storage": "2.2.0",
    "cordova-plugin-network-information": "2.0.1",
    "ionic-angular": "3.9.3",
    "ionicons": "3.0.0",
    "rxjs": "5.5.11",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.29"
  },
  "devDependencies": {
    "@ionic/app-scripts": "^3.2.3",
    "typescript": "~2.6.2"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-network-information": {}
    }
  }
}

ionic-framework ionic3 ionic-native network-connection
person Himanshu itmca    schedule 19.02.2019    source источник
comment
что включает в себя ваш package.json?   -  person Suraj Rao    schedule 05.03.2019
comment
Пожалуйста, проверьте, я обновил свой package.json @SurajRao   -  person Himanshu itmca    schedule 06.03.2019

Ответы (2)


arrow_upward
3
arrow_downward

Вы используете ionic 3/angular 5.x

Вам необходимо обратиться к документации по ionic v3 и использовать нативная версия ionic v4.

npm install --save @ionic-native/network@4

Обязательно удалите оболочку ionic-native/network версии 5.x

Тогда ваш импорт будет:

import { Network } from '@ionic-native/network';
person Suraj Rao    schedule 06.03.2019
comment
Та же проблема со всеми ионно-нативными плагинами. версия 5.x и импорт ngx предназначены для ionic 4/ angular 7.x (ngx - это angular 7). Другие ваши обертки, кажется, только в 4.x, поэтому они работают - person Suraj Rao; 06.03.2019
comment
Пожалуйста, помогите мне в этом stackoverflow.com/questions/58852575/ @Suraj Rao - person Himanshu itmca; 14.11.2019

arrow_upward
1
arrow_downward

Вот пример кода для проверки подключения к Интернету, когда ваше приложение находится в сети или в автономном режиме.

Во-первых, вам нужно создать сетевого провайдера и добавить следующий код:

import { Injectable } from '@angular/core';
import { AlertController, Events } from 'ionic-angular';
import { Network } from '@ionic-native/network';

export enum ConnectionStatusEnum {
    Online,
    Offline
}


@Injectable()
export class NetworkProvider {

  previousStatus;

  constructor(public alertCtrl: AlertController, 
              public network: Network,
              public eventCtrl: Events) {

    console.log('Hello NetworkProvider Provider');

    this.previousStatus = ConnectionStatusEnum.Online;

  }

    public initializeNetworkEvents(): void {
        this.network.onDisconnect().subscribe(() => {
            if (this.previousStatus === ConnectionStatusEnum.Online) {
                this.eventCtrl.publish('network:offline');
            }
            this.previousStatus = ConnectionStatusEnum.Offline;
        });
        this.network.onConnect().subscribe(() => {
            if (this.previousStatus === ConnectionStatusEnum.Offline) {
                this.eventCtrl.publish('network:online');
            }
            this.previousStatus = ConnectionStatusEnum.Online;
        });
    }

}

Теперь добавьте этот код в файл app.component при инициализации вашего приложения,

import { Component } from '@angular/core';
import { Platform,  Events } from 'ionic-angular';
import { Network } from '@ionic-native/network';
import { NetworkProvider } from '../providers/network/network';

@Component({
    templateUrl: 'app.html'
})

export class MyApp {

        constructor(public platform: Platform, 
                    public events: Events,
                    public network: Network,
                    public networkProvider: NetworkProvider) { }

        initializeApp() {

            this.platform.ready().then(() => {

                this.networkProvider.initializeNetworkEvents();

                // Offline event
                this.events.subscribe('network:offline', () => {
                    alert('network:offline ==> '+this.network.type);    
                });

                // Online event
                this.events.subscribe('network:online', () => {
                    alert('network:online ==> '+this.network.type);        
                });

            });
        }

}
person Jaykant    schedule 19.02.2019
comment
я также попробовал то же самое, получил ту же ошибку Uncaught (в обещании): TypeError: Object(...) не является функцией TypeError: Object(...) не является функцией в Network.onDisconnect (index.js:61) в NetworkProvider.webpackJsonp.340.NetworkProvider.initializeNetworkEvents (network.ts:36) - person Himanshu itmca; 19.02.2019
comment
образец кода, которым я поделился, работает для меня. Попробуйте создать сетевого провайдера, он может решить ваши проблемы или опубликовать обновленный код компонента в своем запросе, чтобы посмотреть. - person Jaykant; 19.02.2019
comment
я также создаю сетевого провайдера, но не могу решить эту проблему, получая ту же ошибку - person Himanshu itmca; 19.02.2019
comment
попробуйте импортировать сеть как import {Network} from '@ionic-native/network/ngx'; - person Jaykant; 19.02.2019