如何在 Aurelia 中使用 aurelia-dialog 插件？

Question

我在使用我的测试 Aurelia 应用程序设置 aurelia 对话框插件 (0.2.0) 时遇到问题。

不幸的是，详细说明如何完成此操作的 README.MD 文件存在一些严重漏洞。首先，它没有提到必须将 aureliaDialog 注入你的 class，所以我先尝试了这个：

@inject(HttpClient, DialogService)
export class MyClass{
  constructor(http, dialogService) {
    this.http = http;
    this.dialogService = dialogService;
  }
  ...
}

我尝试使用以下方式调用对话框：

this.dialogService.open({ viewModel: Prompt, model: 'Good or Bad?' })

以上导致以下错误：

Unhandled promise rejection ReferenceError: info is not defined
    at Container.invoke (http://127.0.0.1:9000/jspm_packages/github/aurelia/dependency-injection@0.10.0/aurelia-dependency-injection.js:401:30)
    at Array.<anonymous> (http://127.0.0.1:9000/jspm_packages/github/aurelia/dependency-injection@0.10.0/aurelia-dependency-injection.js:272:44)
    at Container.get (http://127.0.0.1:9000/jspm_packages/github/aurelia/dependency-injection@0.10.0/aurelia-dependency-injection.js:329:24)
    at http://127.0.0.1:9000/jspm_packages/github/aurelia/templating@0.15.1/aurelia-templating.js:3685:75
    at run (http://127.0.0.1:9000/jspm_packages/npm/core-js@0.9.18/modules/es6.promise.js:91:43)
    at http://127.0.0.1:9000/jspm_packages/npm/core-js@0.9.18/modules/es6.promise.js:105:11
    at module.exports (http://127.0.0.1:9000/jspm_packages/npm/core-js@0.9.18/modules/$.invoke.js:6:25)
    at queue.(anonymous function) (http://127.0.0.1:9000/jspm_packages/npm/core-js@0.9.18/modules/$.task.js:40:9)
    at Number.run (http://127.0.0.1:9000/jspm_packages/npm/core-js@0.9.18/modules/$.task.js:27:7)
    at listner (http://127.0.0.1:9000/jspm_packages/npm/core-js@0.9.18/modules/$.task.js:31:9) Unhandled promise rejection ReferenceError: info is not defined(…)(anonymous function) @ es6.promise.js:139module.exports @ $.invoke.js:6queue.(anonymous function) @ $.task.js:40run @ $.task.js:27listner @ $.task.js:31

接下来，我尝试将插件的配置添加到我的 main.js 文件中：

export function configure(aurelia) {
  aurelia.use
    .standardConfiguration()
    .developmentLogging()
    .plugin('aurelia-animator-css')
    .plugin('aurelia-dialog'); // <----- this is what I added

  aurelia.start().then(a => a.setRoot());
}

现在我的应用程序根本无法启动，并在尝试（但失败）启动时产生以下错误：

DEBUG [aurelia] Configured plugin aurelia-dialog. aurelia-logging-console.js:38 
DEBUG [templating] importing resources for undefined [] es6.promise.js:139 
  Unhandled promise rejection Error: Cannot read property 'querySelectorAll' of undefined(…)
  (anonymous function) @ es6.promise.js:139module.exports @ $.invoke.js:6queue.
  (anonymous function) @ $.task.js:40run @ $.task.js:27listner @ $.task.js:31

我现在不知道接下来要尝试什么。感谢您提供有关此问题的任何见解。

我也希望 aurelia-dialog 插件的维护者修改文档以减轻设置过程的痛苦。

谢谢，格雷格

Answer 1

最后发现是aurelia-dialog 0.2.0的bug。 0.2.1 版本修复了我无法自行解决的问题：https://github.com/aurelia/dialog/pull/24。

我必须遵循的其他步骤仍然是必要的 - 您将需要注入 DialogService class 并修改您的 main.js 文件以添加配置。

如何在 Aurelia 中使用 aurelia-dialog 插件？

How to use the aurelia-dialog plugin with Aurelia?

javascript

aurelia