在 AlloYUI Diagram Builder 中更改节点的默认编辑器答案

【问题标题】：Change default editor for node in AlloYUI Diagram Builder在 AlloYUI Diagram Builder 中更改节点的默认编辑器
【发布时间】：2013-10-03 22:27:57
【问题描述】：

我必须做一个图表编辑器，所以我使用的是 AlloYUI，我在this question 的答案之后添加了一个自定义节点。

我已成功设置新节点并通过 diagramBuilder.toJSON() 检索其值

我要做的是更改自定义节点的自定义属性的默认编辑器小部件，我想更改日期选择器小部件的文本框，但我的目标是能够使用任何其他表单元素，例如一个选择或一组单选按钮。

玩弄 WebStorm 中包含的 javascript 调试器，我发现默认字段有一个“editor”属性，其中定义了一个“textAreaCellEditor”。

但是我的自定义属性没有这个属性，所以我试图附加一个编辑器，但我无法让它工作，我试过这个：

Y.DiagramNodeCustom = Y.Component.create({
        NAME: 'diagram-node',

        ATTRS: {
          type: {
            value: 'custom'
          },
          custom_attr: {
            value: 'customAttr'
          }
        },
        EXTENDS: Y.DiagramNodeTask,

        prototype: {
          getPropertyModel: function () {
            var instance = this;

            var model = Y.DiagramNodeTask.superclass.getPropertyModel.apply(
                instance, arguments);

            model.push({
              attributeName: 'customAttr',
              name: 'Custom Attribute',
              editor: Y.Component.create({
                NAME: "DateField",
                EXTENDS: Y.DateCellEditor
              })
            });

            return model;
          },
          SERIALIZABLE_ATTRS: ['description', 'name', 'required', 'type',
            'width', 'height', 'zIndex', 'xy', 'customAttr']
        }

      });
      Y.DiagramBuilder.types['custom'] = Y.DiagramNodeCustom;

我也尝试将“model.push”部分更改为：

model.push({
      attributeName: 'customAttr',
      name: 'Custom Attribute',
      editor: {name: "textCellEditor"}
    });

到：

model.push({
          attributeName: 'customAttr',
          name: 'Custom Attribute',
          editor: Y.DateCellEditor({
            name: 'DateCellEditor'
          })
        });

但是没有任何效果。您知道如何更改默认编辑器吗？

【问题讨论】：

标签： javascript alloy-ui

【解决方案1】：

感谢 Robert Frampton，他在google groups 中回答了我的问题，方法是：

model.push({
   attributeName: 'customAttr',
   name: 'Custom Attribute',

   editor: new Y.DateCellEditor()
});

您必须创建 Y.DateCellEditor 对象的新实例，并在构造函数之前添加“new”。

【讨论】：