网站搜索

javascript - Angular 4 应用错误: "core.es5.js:1169 未捕获错误: 没有 PlatformRef 的提供者!"


我在尝试使用浏览器运行单页应用时遇到以下错误(在 Chrome 和 Safari 上也有同样的问题)。我正在使用 Angular CLI(Angular 4)和 TypeScript。我确实有一个唯一的组件和一个唯一的模块。使用主组件时,我正在尝试从后端请求一些数据。

浏览器提出的问题:

core.es5.js:1169 Uncaught Error: No provider for PlatformRef!
at injectionError (core.es5.js:1169)
at noProviderError (core.es5.js:1207)
at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._throwOrNull (core.es5.js:2649)
at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._getByKeyDefault (core.es5.js:2688)
at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._getByKey (core.es5.js:2620)
at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_.get (core.es5.js:2489)
at createPlatform (core.es5.js:4239)
at core.es5.js:4265
at core.es5.js:4262
at core.es5.js:4262

该错误似乎是由主模块中注入的主组件内的以下代码行引起的: let res= new CalculatorCore().getMaxProfitCurrencyPath(500, dataManager.getCalculateDataStructure("EUR"));

这里是类 CalculatorCore:

import { Currency } from "./currency";
import { Map } from 'collections/map';

export class CalculatorCore {

private inputOutputCurrency: string = "EUR";

constructor() {
}


getMaxProfitCurrencyPath( price: number, currency: Currency, steps?: number, path?: Currency[]):Map<number,string[]> {

let returningPath: Map<number, string[]> =  new Map<number,string[]>();

currency.getConvertibles().forEach((key:Currency, value:number) => {

    if (!steps) {
      steps = 2;
    } else if (steps > 0) {
      steps--;
      if (currency.getLabel() == this.inputOutputCurrency){
        path = [];
    }

      path.push(key);

      this.getMaxProfitCurrencyPath(price*value, key, steps, path);
    } else if (steps == 0 && key.getConvertibles().has(this.inputOutputCurrency)){
          path.push(key.getConvertibles().get(this.inputOutputCurrency));
          returningPath.add(key.getConvertibles().get(this.inputOutputCurrency)*price, path);
        }
      });

return returningPath;
   }
}

这里是组件代码:

import {Component, OnInit} from '@angular/core';
import { KrakenClient } from 'kraken-api/kraken.js';
import {DataManager} from "./data-manager";
import {CalculatorCore} from "./calculator-core";


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{

  ngOnInit(): void {
   let dataManager = new DataManager();

   let res =  new CalculatorCore().getMaxProfitCurrencyPath(500, dataManager.getCalculateDataStructure("EUR"));

   console.log(res);

  }

  constructor(){
    console.log("App-component constructor")
  }

}

有人能解释这个错误吗?谢谢,

答案#1

由无效的 bootstrap 设置引起。

修复

使用 angular-cli 创建一个新项目,并比较你是如何引导的与 Angular 最新推荐的指导方法。

答案#2

看来问题是由使用 collections/map 引起的。