Angular2使用ES5实现Web Workers

Question

我开始使用Angular2，但是编写的是ES5代码，这意味着我通常需要将找到的示例和指南从TypeScript的解答中翻译过来。

请问有人可以帮我提供一个ES5版本的以下操作吗:

启动应用程序。在TypeScript中，我看到它是这样完成的:

import {WORKER_APP_PLATFORM, WORKER_APP_APPLICATION} from "angular2/platform/worker_app";
import {platform} from "angular2/core";
platform([WORKER_APP_PLATFORM]).application([WORKER_APP_APPLICATION]).bootstrap(myApp)

访问 web_workers 组件：

import {Component} from 'angular2/web_worker/worker';
@Component({ ... ])

我认为后者将通过调用实现

ng.web_worker.worker.Component({ ... })

但是似乎不是这种情况：ng.web_worker未定义。

问题可能是我似乎无法正确地包含web_worker/ui.js。当我使用它来替换bundles/angular2-all.umd.js时，只会出现有关require未定义的错误消息。当我明确地将RequireJS包含在我的项目中时，会出现许多其他错误。

任何帮助将不胜感激！

- MatsGA

---

你从哪里得到这段代码的？组件是Angular 2核心的一部分，而不是web_worker。我只发现worker_app模块导出了一些WORKER_RENDER、MessageBus等内容，我在这里找到它：https://github.com/angular/angular/blob/master/modules/angular2/docs/web_workers/web_workers.md - Andrey

我找到了这个代码示例：http://www.syntaxsuccess.com/viewarticle/web-workers-in-angular-2.0 - MatsGA

好的，你想做的事情是使用以UMD格式打包的Angular 2部分。但我找不到包含Web Workers的Angular 2 UMD构建版本。所以现在我唯一能想到的ES5解决方案是尝试使用SystemJS模块来使用未打包的Angular 2。（我希望我错了，你可以找到更简单的解决方案） - Andrey

这可能有点粗糙，但你考虑过用TypeScript来编写并检查生成的JavaScript代码吗？ :) - toskv

别忘了你可以把 TypeScript 粘贴到这里，它会很快地展示 ES5：http://www.typescriptlang.org/Playground。 - spozun

Answer 1

我可以问一下，为什么您想使用ES5？如果您不喜欢TypeScript，可以轻松地使用SystemJS和ES6。TypeScript几乎与ES6相同。

如果您仍然想使用ES5，则需要将导入更改为require调用：

var WORKER_APP_PLATFORM = require("angular2/platform/worker_app").WORKER_APP_PLATFORM;
var WORKER_APP_APPLICATION = require("angular2/platform/worker_app").WORKER_APP_APPLICATION;
var platform = require("angular2/core").platform;
platform([WORKER_APP_PLATFORM]).application([WORKER_APP_APPLICATION]).bootstrap(myApp)

另一个例子：

var Component = require('angular2/web_worker/worker').Component;

你明白了。你也不需要使用RequireJS...你可以使用SystemJS。你应该像这样导入主文件：

System.import("main")

SystemJS将解决所有的require调用异步，但在代码中，require调用看起来是同步的。

- carlosdubusm

---

谢谢您的回复。我们改变了对ES5的看法，并重新使用TypeScript进行了实现，这并不像我们担心的那样困难。还是感谢您的帮助。 - MatsGA