javascript - 无法从另一个 .ts 文件访问 .ts 文件中定义的函数定义

Question

如果您愿意花 2 美分来解决调用另一个文件中定义的函数的问题，我将不胜感激。我阅读了 Typescript 的文档，其中建议设置一个接口(interface)或一个模块，然后引用它，但我收到了与下面相同的错误。

错误

ReferenceError: viewReport is not defined

文件结构

sample
  - sample.component.ts
  - sample.component.html
  - sample.component.css
  pdf
    viewReport.ts

sample.component.ts

import './pdf/viewReport';

declare var pdfMake: any;
declare var viewReport: any;

export class SampleComponent {

    addr = {
        "streetaddress": '',
        "cityName": '',
        "stateCode": '',
        "zipCode": ''
    };

    constructor() {}

    data = {
        header: {
            "address": {
                "street": this.addr.streetAddress,
                "city": this.addr.cityName,
                "state": this.addr.stateCode,
                "zip": this.addr.zipCode 
            }
        }

    }

    downloadPdf(){
        let pdf = pdfMake;
        pdf.createPdf(viewReport(this.data)).download('test.pdf');
    }
}

viewReport.ts

function viewReport( data ) {
    let docDefinition = {
      content: [{
        text: 'Address: ' + data.header.address.street
      }]
    }
    console.log( 'data:: ', data );
    return docDefinition;
}

Answer 1

我能够通过对代码进行以下更改来解决该问题:

viewReport.ts

导出时添加关键字“默认”

export default function viewReport( data ) {

sample.component.ts

替换

import './pdf/viewReport';
declare var viewReport: any;

与

import viewReport from './pdf/viewReport';

引用文献

@n00dl3
@vesse
https://www.typescriptlang.org/docs/handbook/modules.html