Dojo中data-dojo-props置于JS对象内时无法绑定模型的问题

看起来你遇到的问题核心是作用域和对象实例化时机导致Dojo无法找到myObject变量，或者上下文self的指向不对。咱们一步步拆解解决：

1. 核心问题分析 #

当你直接声明var model;时，这个变量大概率处于全局作用域，所以Dojo解析data-dojo-props时能顺利找到它。但把model放到MyObject里后：

• 如果myObject是在局部作用域（比如require回调内部）声明的，JSP模板里的Dojo解析器无法访问到这个变量，就会抛出myObject未定义的错误。
• 用self.model时，self的指向可能不是你预期的MyObject实例，导致绑定逻辑找不到目标属性。

2. 解决方案一：确保myObject在全局作用域可访问 #

如果你的场景是在页面直接使用（非自定义Widget），需要把MyObject的实例挂载到全局window对象上，让Dojo解析器能找到它：

步骤1：正确定义MyObject（基于AMD模块规范） #

// MyObject.js
define(["dojo/Stateful"], function(Stateful) {
  function MyObject() {
    // 重点：必须使用Dojo的可观察对象（比如Stateful），普通JS对象无法被at()绑定监听
    this.model = new Stateful({ myValue: "" });
  }
  return MyObject;
});

步骤2：在页面加载时实例化并暴露到全局 #

require(["MyObject"], function(MyObject) {
  // 把实例挂到window上，让JSP模板能直接访问到
  window.myObject = new MyObject();
});

步骤3：JSP中的输入框绑定 #

<input type="text" data-dojo-type="dijit/form/TextBox" 
       data-dojo-props="value: at(myObject.model, 'myValue')">

3. 解决方案二：在自定义Widget中使用正确的上下文 #

如果是在Dojo自定义Widget里使用，要确保myObject是Widget实例的属性，模板里用this来访问正确的上下文：

步骤1：自定义Widget代码 #

define([
  "dojo/_base/declare",
  "dijit/_WidgetBase",
  "dijit/_TemplatedMixin",
  "dojo/text!./MyWidget.html",
  "dojo/Stateful"
], function(declare, _WidgetBase, _TemplatedMixin, template, Stateful) {
  return declare([_WidgetBase, _TemplatedMixin], {
    templateString: template,
    
    postCreate: function() {
      this.inherited(arguments);
      // 初始化MyObject实例，作为Widget实例的属性
      this.myObject = {
        model: new Stateful({ myValue: "" })
      };
    }
  });
});

步骤2：Widget模板（MyWidget.html） #

<input type="text" data-dojo-type="dijit/form/TextBox" 
       data-dojo-props="value: at(this.myObject.model, 'myValue')">

4. 关键注意事项 #

• 实例化时机要早：myObject的实例化必须在Dojo解析器（dojo/parser）运行之前完成，或者手动调用parser.parse()在实例化后触发解析，否则解析器会找不到变量。
• 必须用可观察对象：model必须是Dojo的可观察类型（比如dojo/Stateful、dstore/Store），普通JS对象无法被at()监听，绑定自然失效。
• 检查控制台错误：除了myObject未定义，还要查看是否有模块加载失败的错误，比如MyObject.js路径配置错误导致模块未加载。

内容的提问来源于stack exchange，提问作者outofmind