Javascript 如何在Aurelia对话框中从DI容器注入对象

使用Aurelia，你可以把东西放进容器，然后注入。对话框中不共享容器状态

有没有办法获取我注入到容器中的数据，并在对话框中使用它

---

代码示例 home.js

fetchString(){
  this.data = JSON.parse(stringform);
  this.container.registerInstance('tpscform', this.data);
}

import {DialogService} from 'aurelia-dialog';
import {LookupFieldsDialog} from './dialog/lookup-fields-dialog';

@inject('tpscform', DialogService)
export class LookupFieldsQuestion {

  constructor(form, dialog){
    console.log(form); // returns the object from the container - works
    //...
  }

  submit() {
    this.dialogService.open({
      viewModel: LookupFieldsDialog,
      model: this.question,
      lock: false
    });
  }

}

import {inject} from 'aurelia-framework';
import {DialogController} from 'aurelia-dialog';

@inject(DialogController, 'tpscform')
export class LookupFieldsDialog {

  constructor(controller, form) {
    this.controller = controller;
    console.log(form); // Returns the string 'tpscform' - doesn't work
  }

  activate(question) {
    this.question = question;
  }

}

自定义元素.js

fetchString(){
  this.data = JSON.parse(stringform);
  this.container.registerInstance('tpscform', this.data);
}

import {DialogService} from 'aurelia-dialog';
import {LookupFieldsDialog} from './dialog/lookup-fields-dialog';

@inject('tpscform', DialogService)
export class LookupFieldsQuestion {

  constructor(form, dialog){
    console.log(form); // returns the object from the container - works
    //...
  }

  submit() {
    this.dialogService.open({
      viewModel: LookupFieldsDialog,
      model: this.question,
      lock: false
    });
  }

}

import {inject} from 'aurelia-framework';
import {DialogController} from 'aurelia-dialog';

@inject(DialogController, 'tpscform')
export class LookupFieldsDialog {

  constructor(controller, form) {
    this.controller = controller;
    console.log(form); // Returns the string 'tpscform' - doesn't work
  }

  activate(question) {
    this.question = question;
  }

}

查找字段对话框.js

fetchString(){
  this.data = JSON.parse(stringform);
  this.container.registerInstance('tpscform', this.data);
}

import {DialogService} from 'aurelia-dialog';
import {LookupFieldsDialog} from './dialog/lookup-fields-dialog';

@inject('tpscform', DialogService)
export class LookupFieldsQuestion {

  constructor(form, dialog){
    console.log(form); // returns the object from the container - works
    //...
  }

  submit() {
    this.dialogService.open({
      viewModel: LookupFieldsDialog,
      model: this.question,
      lock: false
    });
  }

}

import {inject} from 'aurelia-framework';
import {DialogController} from 'aurelia-dialog';

@inject(DialogController, 'tpscform')
export class LookupFieldsDialog {

  constructor(controller, form) {
    this.controller = controller;
    console.log(form); // Returns the string 'tpscform' - doesn't work
  }

  activate(question) {
    this.question = question;
  }

}

---

正如@FabioLuz所提到的，您可以将容器传递到对话框中：

import {Container} from 'aurelia-framework';
import {DialogService} from 'aurelia-dialog';
import {LookupFieldsDialog} from './dialog/lookup-fields-dialog';

@inject(DialogService, Container)
export class LookupFieldsQuestion {

  constructor(dialogService, container) {
    this.container = container;
    this.dialogService = dialogService;
  }

  submit() {
    this.dialogService.open({
      viewModel: LookupFieldsDialog,
      model: this.question,

      // Share current container here
      childContainer: this.container.createChild(),

      lock: false
    });
  }

---

我为此提出了一个问题：如果传递视图模型的实例会怎么样？像

viewModel:newlookupfieldsquestion（variableFromDI）

？您还可以尝试在打开的容器中传递子容器method@FabioLuz实际上，将变量传递给对话框不是问题。对话框中有几个层次的元素，它们使用DI访问全局元素，我使用这些元素跟踪应用程序状态。我可能能够将数据输入到对话框中，但如果其他三十个元素不在对话框中，我不想将其传递给使用依赖项注入的其他三十个元素？比如：

this.dialogService.open（{childContainer:this.container.createChild（）}）

？@FabioLuz有办法做到这一点吗？因为这样会更好一点/更干净一点-在custom-element.js中导入

容器

，然后调用

this.dialogService.open（{childContainer:this.Container.createChild（）}）

@FabioLuz这很简单，很棒！这是像这样的插件的默认行为吗？是的。通常，插件可以选择传递子容器。你可以在这里找到说明