我正在使用dojo-1.9.1并且我正在扩展一个小部件,我要在继承的templateString中向表中添加一个<tr>
节点。插入节点但不替换变量。有人可以查看下面的来源并指出实施中的错误。顺便说一下,这是我第一次创建小部件。
LVS /插件/ LoginPage.js
define([
// Dojo
"dojo/_base/declare",
"dojo/dom-construct",
"dojo/query",
// Dijit
"dijit/_WidgetBase",
// xwt
"xwt/widget/LoginPage",
"xwt/widget/CommonUtilities",
// lvs
"dojo/text!./templates/UserRegistration.html"
], function(
// Dojo
declare,
domConstruct,
query,
// Dijit
_WidgetBase,
// xwt
LoginPage,
xwtUtils,
// lvs
UserRegistration
) {
// We declare the namespace of our widget and add the mixins we want to use.
return declare("lvs.widget.LoginPage", [ LoginPage, _WidgetBase ], {
// userRegistrationLabel: String
// The text used for redirecting to user registration page
userRegistrationLabel: "New User? Register here.",
// userRegistrationURL: String
// URL for the page to register new user
userRegistrationURL: "RegistrationForm.html",
// needUserRegistrationLink: Boolean
// Whether the user registration link is visible or hidden
needUserRegistrationLink: true,
constructor: function(args) {
//make the constructor arguments a mixin
declare.safeMixin(this, args);
},
buildRendering: function() {
this.inherited(arguments);
var root = this.domNode;
var row = domConstruct.toDom(UserRegistration);
query('tr[dojoAttachPoint="problemRowAP"]', root).forEach(function(node) {
domConstruct.place(row, node, "after");
});
this.templateString = this.domNode.innerHTML;
// This does not work either
//domConstruct.place(UserRegistration, this.problemRowAP, "after");
},
postCreate: function() {
this.inherited(arguments);
this.set("userRegistrationURL", this.userRegistrationURL);
this.set("userRegistrationLabel", this.userRegistrationLabel);
},
startup: function() {
this.inherited(arguments);
if(!this.needUserRegistrationLink){
this._removeUserRegistrationLink();
}
},
_showUserRegistrationDlg: function() {
xwtUtils.openURL(this.userRegistrationURL, "_new");
},
_removeUserRegistrationLink: function() {
dojo.destroy(this.userRegistrationRowAP);
},
_setUserRegistrationLabelAttr: function(label) {
this._set("userRegistrationLabel", label);
},
_setUserRegistrationURLAttr: function(url) {
this._set("userRegistrationURL", url);
}
});
});
LVS /插件/模板/ UserRegistration.html
<tr data-dojo-attach-point="userRegistrationRowAP">
<td></td>
<td class="problem" style="padding-left: 0px; padding-top: 5px;">
<span data-dojo-attach-point="userRegistrationAP" class="problemsLoggingIn" style="margin-left: 8px;">
<a data-dojo-attach-point="userRegistrationAnchor" href="${userRegistrationURL}" target="_top" tabIndex="0" data-dojo-attach-event="ondijitclick:_showUserRegistrationDlg">${userRegistrationURL}</a>
</span>
</td>
</tr>
小部件实例化代码:
var loginPage = new LoginPage({
id: "login_form",
// other properties set here...
userRegistrationLabel: "New user registration",
userRegistrationURL: "RegistrationPage.html",
onClickSubmit: function() {
alert('The form will be submitted');
}
}, "login_form");
loginPage.set('userRegistrationLabel', 'New User? Register here.');
loginPage.set('userRegistrationURL', 'RegistrationPage.html');
loginPage.startup();
输出附在下面。
答案 0 :(得分:2)
dojo变量替换发生在postMixinProperties()中,它在buildRendering()之前运行。您的tr-expansion代码是从buildRendering()调用的,因此它与替换模板一起发生。
您需要在主后混合代码之前进行模板覆盖,但在这种情况下,您无法使用domConstruct调用执行此操作(因为在此阶段它们尚未被解析)。