ios loading failure

[cnqiuxue]

The page does not have an animation style

loading.service.ts

import { Injectable } from "@angular/core";
const LoadingIndicator = require("nativescript-loading-indicator").LoadingIndicator;

@Injectable()
export class LoadingService {
    loader: any;
    constructor() {
        this.loader = new LoadingIndicator();
    }
    show() {
        console.log("graphql.module.ts  show=======");
        this.loader.show(options);
    }

    hide() {
        this.loader.hide();
    }
}
export const options = {
    message: "Loading...",
    progress: 0.65,
    android: {
        indeterminate: true,
        cancelable: true,
        // tslint:disable-next-line:no-empty
        cancelListener(dialog) { },
        max: 100,
        progressNumberFormat: "%1d/%2d",
        progressPercentFormat: 0.53,
        progressStyle: 1,
        secondaryProgress: 1
    },
    ios: {
        details: "Additional detail note!",
        margin: 10,
        dimBackground: true,
        color: "#4B9ED6", // color of indicator and labels
        // background box around indicator
        // hideBezel will override this if true
        backgroundColor: "yellow",
        userInteractionEnabled: false, // default true. Set false so that the touches will fall through it.
        hideBezel: true// default false, can hide the surrounding bezel
  }
};

app.module.ts

import { LoadingService } from "./shared/loading.service";

providers: [
      LoadingService
]

import { LoadingService } from "./loading.service";
constructor(
        private loadService: LoadingService
 ) { }

this.loadService.show();

package.json

"dependencies": {
    "@angular/animations": "~5.2.0",
    "@angular/common": "~5.2.0",
    "@angular/compiler": "~5.2.0",
    "@angular/core": "~5.2.0",
    "@angular/forms": "~5.2.0",
    "@angular/http": "~5.2.0",
    "@angular/platform-browser": "~5.2.0",
    "@angular/platform-browser-dynamic": "~5.2.0",
    "@angular/router": "~5.2.0",
    "apollo-angular": "^1.0.1",
    "apollo-angular-link-http": "^1.0.1",
    "apollo-cache-inmemory": "^1.2.2",
    "apollo-client": "^2.3.2",
    "apollo-link": "^1.2.2",
    "apollo-link-error": "^1.0.9",
    "graphql": "^0.13.2",
    "graphql-tag": "^2.9.2",
    "moment": "^2.22.1",
    "moment-hijri": "^2.1.1",
    "nativescript-advanced-webview": "^2.0.2",
    "nativescript-angular": "~5.3.0",
    "nativescript-audio-player": "^1.0.3",
    "nativescript-feedback": "^1.2.0",
    "nativescript-geolocation": "^4.2.6",
    "nativescript-google-maps-sdk": "^2.6.0",
    "nativescript-loading-indicator": "^2.4.0",
    "nativescript-localstorage": "^1.1.5",
    "nativescript-plugin-firebase": "^6.4.0",
    "nativescript-pulltorefresh": "^2.1.1",
    "nativescript-social-share": "^1.5.0",
    "nativescript-theme-core": "~1.0.4",
    "nativescript-ui-calendar": "^3.6.0",
    "nativescript-ui-listview": "^3.5.8",
    "reflect-metadata": "~0.1.10",
    "rxjs": "~5.5.5",
    "tns-core-modules": "4.1.0",
    "uglify-es": "^3.2.2",
    "zone.js": "~0.8.18"
  }