标签: aurelia-dialog

我有以下内容:

<ai-dialog>
    <ai-dialog-header style="display:flex;justify-content:space-between">
        <span>New Person</span>
        <i class="fa fa-close" style="cursor:pointer" click.delegate="controller.cancel()"></i>
    </ai-dialog-header>

    <ai-dialog-body>
        <div style="display:flex;flex-grow: 1">
            <div class="field">
                <div class="field-title">First Name</div>
                <div class="field-value">
                   <input style="flex-grow:1" type="text" attach-focus="true" value.bind="criteria.firstName & validate" />
                </div>
            </div>
            ....
        </div>
     </ai-dialog-body>

     <ai-dialog-footer>
         ...
     </ai-dialog-footer>

当显示对话框时,我希望第一个名字输入框有焦点但没有任何焦点 - 我手动必须在框中单击以设置焦点.

有什么想法吗？

使用新的aurelai版本时我遇到了问题:

• 我使用:au new myApp创建了一个新的应用程序
• 我通过npm安装了aurelia对话框
• 当我导入aurelia对话框并尝试使用运行应用程序时

au run --watch

我得到htis错误:

[错误:ENOENT:没有这样的文件或目录,打开'C:\ src\ai-dialog.js']

任何的想法 ？

我有一个类使用DialogService来自'aurelia-dialog` 的实例来打开我的Aurelia应用程序中的几乎每个对话框.以非常抽象的方式,类看起来像这样:

export class DialogTrigger{
    triggerDialogA() {...}
    triggerDialogB() {...}
    triggerDialogC() {...}
}

一切正常,直到我尝试注入DialogTrigger其中一个对话框.

所以我想说我想创建一个新的对话框DialogD.我只需添加另一种方法triggerDialogD()在DialogTrigger打开一个新的对话框DialodD视图模型和一切正常.但是,如果我希望我的新对话框也可以通过使用DialogTrigger一切实例来触发其他对话框(A,B或C)之一.

如果我注入DialogTrigger到DialogD我总是得到一个错误:

键/值不能为null或未定义.您是否尝试注入/注册DI不存在的内容？

如果我删除依赖项,该对话框将起作用.

TL; DR 我有一个DialogTrigger打开aurelia-dialogs 的课程.当我注入DialogTrigger由它实例化的任何对话框时,DI失败.

有任何想法吗？

我有一个启动确认对话框的视图，但不是等待对话框返回结果，而是直接跳转到承诺的“then”部分。见下面的代码：

ConfirmDialog.ts

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

@inject(DialogController)
export class ConfirmDialog {
  private message: string;
  private controller: DialogController;

  constructor(controller: DialogController) {
    this.controller = controller;
  }

  public activate(message: string) {
    this.message = message;
  }
}

确认对话框.html

<template>
  <div tabindex="-1" role="dialog">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" click.trigger="controller.cancel()" class="close" aria-label="Close"><span aria-hidden="true">&times;</span></button>
          <h4 class="modal-title">Confirmation</h4>
        </div>
        <div class="modal-body">
          ${message}?
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" click.trigger="controller.cancel()">No!</button>
          <button type="button" class="btn btn-danger" click.trigger="controller.ok()">Yes</button>
        </div>
      </div><!-- /.modal-content …