1

我正在做混合 AngularJS/Angular5 应用程序。所以我正在尝试逐步将我的 JavaScript 文件更改为 Typescript。我有javascript文件:

(function () {
    'use strict';

    var domainPath = "http://localhost:26264/";
    var reportAPI = "http://localhost:58629/";
    var onlineHelpURL = "http://localhost:8085/";
    var hh6ServiceUrl = "https://localhost:40100/";

    var sysSettings = {
        webServiceURL: domainPath,
        hh6ServiceUrl: hh6ServiceUrl,
        reportServiceURL: reportAPI,
        onlineHelpURL: onlineHelpURL
    };

    angular.module('app.sysSettings', []).constant("sysSettings", sysSettings);
})();  

我在打字稿中对其进行了更改,以便能够将其导出并在我的打字稿文件中重用设置:

declare var angular: any;

let sysSettingsts = (function () {
    'use strict';
    var domainPath = "http://localhost:26264/";
    var reportAPI = "http://localhost:58629/";
    var onlineHelpURL = "http://localhost:8085/";
    var hh6ServiceUrl = "http://localhost:40100/";
    var sysSettings: any = {
        webServiceURL: domainPath,
        hh6ServiceUrl: hh6ServiceUrl,
        reportServiceURL: reportAPI,
        onlineHelpURL: onlineHelpURL
    };

    angular.module('app.sysSettings', []).constant("sysSettings", sysSettings);

    return sysSettings;
})();

export default sysSettingsts;

但是当我尝试导入该文件时:

import { Injectable } from '@angular/core';
import { TranslateLoader } from '@ngx-translate/core';
import { Observable } from 'rxjs/Observable';
import {HttpClient} from "@angular/common/http";
import {sysSettingsts} from "angular/sysSettings";

@Injectable()
export class CustomTranslateLoader implements TranslateLoader  {

  constructor(private http: HttpClient,
              private item: sysSettingsts) {
    this.item = item;
  }

  getTranslation(lang: string): Observable<any>{

var apiAddress = this.item.domainPath + "api/GlobalResources/?lang=" + lang;
return Observable.create(observer => {
  this.http.get(apiAddress, ).subscribe(res => {
      observer.next(res);
      observer.complete();
    },
    error => {
      console.log("cannot retrieve Global Resources");
    }
  );
});

}

我只能看到import {sysSettingsts} from "angular/sysSettings"; 文件但洞察构造函数我的 sysSettingsts 未定义。

  constructor(private http: HttpClient,
              private item: sysSettingsts) {
    this.item = item;
  }

我尝试直接在方法内部使用 sysSettingsts 但值也未定义...请任何人告诉我如何导出在打字稿中执行的函数或至少给出一些想法如何从我的打字稿文件中导入设置另一个打字稿文件(使设置可重复使用)。

谢谢

4

2 回答 2

2

您要更改的文件不会导出任何内容,此文件的目的是它的副作用(它修改了外部angular对象)。你不想对文件的返回值做任何事情,你只想执行它的代码。

然后就import 'your-file.ts';和去掉周围的自执行函数

于 2018-09-10T21:32:55.733 回答
1

更改您的导出或导入语法。现在他们不匹配。

使用默认导出时:

export default sysSettingsts;

对应的导入语法为:

import sysSettingsts from "angular/sysSettings"

注意缺少大括号。


或者,如果您想保持相同的导入语法,请改用常规(非默认)导出:

export { sysSettingsts }

您可以在此处阅读有关导入/导出模式的更多信息

于 2018-09-10T21:22:54.417 回答