Question

我正在使用Angular 5来开发我的应用程序在assets / js文件夹中，我有一个js文件test.js。我在这个js文件中有一个变量data和一个函数Loaddata()。我希望能够在我的app.component.ts中访问这些内容。

我能够将变量作用域公开，并且能够在component.ts中访问它，但是我没有对该函数执行相同的操作。

这是我对变量所遵循的过程：
1.在angular-cli.json

中添加js文件的引用

        "scripts": [
                "assets/js/test.js"
         ]

2。在typings.d.ts文件中添加了变量名称。

       declare var data:any;

现在我可以在app.component.ts中访问此变量我希望能够以类似的方式访问该功能任何人都可以解释我该怎么做。

Answer 1

这似乎是使用Injectable Service的一个很棒的用例。在应用程序的src / app目录中创建一个loadData.service.ts文件（如果您使用的是Angular CLI），然后将其格式设置为这样。

import { Injectable } from '@angular/core';

@Injectable()
export class LoadDataService {
    data = [
        // Your Data Here
    ]
    constructor() {};

    loadData(params?) {
        // your code here
    }
}

然后，只要您需要在组件中使用该函数，只需将服务导入组件，在构造函数中创建它的本地实例，然后使用它！要访问数据，只需将其设置为该组件构造函数中的另一个变量。

import { LoadDataService } from '../loadData.service';

@Component({
    //whatever
})

export class YourComponent {
    dataFromService: [];
    constructor(private loadDataService: LoadDataService) {
        this.dataFromService = this.loadDataService.data;
    }

    runThisToGetData() {
        this.loadDataService.loadData(yourParams).subscribe(r => r);
    }
}

祝你好运！

Answer 2

看看：https://nodejs.org/api/modules.html

您可以使用导出来执行您要求的操作。

foo.js

module.exports = {
  hello: () => alert('hello from foo!')
};

编辑----修正语法

bar.js

const foo = require('./foo.js');
foo.hello();

如何在角度5中使js函数公开

2 个答案: