Question

我正在做Hybrid 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，但该值也未定义... 可以请任何人给我一个麻烦，我怎样才能导出在打字稿中执行功能，或者至少给出一些想法，如何从另一个打字稿文件中的打字稿文件中导入设置（使设置可重复使用）。

谢谢

Answer 1

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

使用默认导出时：

export default sysSettingsts;

相应的导入语法为：

import sysSettingsts from "angular/sysSettings"

请注意缺少括号。

或者，如果您希望保持相同的导入语法，请改用常规（非默认）导出：

export { sysSettingsts }

You can read more about the import/export pattern here。

Answer 2

您要更改的文件不会导出任何内容，该文件的目的是其副作用（它修改了外部angular对象）。您不希望对文件的返回值做任何事情，只想执行其代码即可。

然后仅import 'your-file.ts';并删除周围的自执行功能

将自我执行功能导入打字稿中的另一个类

2 个答案: