2013-12-08 33 views
1

我正在使用dojo-1.9.1,我正在擴展一個小部件,我必須將<tr>節點添加到繼承的templateString中的表中。該節點已插入但變量未被替換。有人可以看看下面的來源並指出實施過程中出現了什麼問題。順便說一句,這是我第一次嘗試創建一個小部件。dojo 1.9:在修改過的templateString上的變量替換失敗

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(); 

輸出被連接下面。

enter image description here

回答

2

道場變量替換髮生在postMixinProperties(),它buildRendering()之前運行。你的tr擴展代碼是從你的buildRendering()中調用的,因此它會發生在被替換的模板上。

您需要在主後混合代碼之前完成模板覆蓋,但在這種情況下,您無法使用domConstruct調用完成此操作(因爲在此階段中它們尚未解析)。

+0

感謝您的洞察力。你如何建議這可以做到? –

+1

你可以用多種方式做到這一點。最乾淨的是,如果你繼承了一個帶有過量聲明模板的新小部件。這使您能夠在沒有domConstruct操作的情況下使用簡單的html代碼對錶格做進一步的修改。我相信這不是Dojo中最後一個模板問題,它不是你的錯。 – peterh

+0

因爲我沒有時間完成原型,所以我將模板複製到我的名稱空間並修改了html以添加額外的行。感謝您的建議。 –