How to use aurelia-dialog plugin with Aurelia?

Question

I am having trouble setting up the aurelia-dialog (0.2.0) plugin with my Aurelia test application.

Unfortunately, the README.MD file, which details how to do this, has serious flaws. Firstly, it does not mention that you need to inject aureliaDialog into your class, so I tried this first:

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

I tried calling a dialog using:

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

The above results lead to the following errors:

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

Then I tried to add the plugin configuration to the main.js file:

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());
}

Now my application does not start at all and generates the following error when trying (and failing) to start:

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

Now I'm losing what to try next. Thanks for any insight you can offer with this issue.

, aurelia-dialog , .

,

Answer 1

​​ aurelia 0.2.0. 0.2.1 , : https://github.com/aurelia/dialog/pull/24.

, , - - DialogService main.js, .