1

冗長性を回避し、汎用XTemplateを呼び出して、タイムスタンプからGMTで日付と時刻をフォーマットしようとしています。

これは私が期待する文字列を出力せず、UIの[オブジェクトオブジェクト]だけを出力します。

SCB.RMWB.templates = {
    timeStamp: function(stamp) {
        return new Ext.XTemplate(   
            '<span class="time-frame">{[ this.dateRangeMsg(stamp) ]}</span>',   
            {
                dateRangeMsg: function(stamp) {

                    console.log('stamp', stamp);    

                    var dateTime = new Date(),
                        now = Ext.Date.format(dateTime, 'U'),           // gives us seconds since the UNIX Epoch from Ext.Date class
                        offset = Ext.Date.format(dateTime, 'Z'),        // gives us GMT offset from Ext.Date class
                        minutesAgo = (now - 300),                       // 5 minutes ago
                        hourAgo = (now - 3600),                         // one hour ago
                        msg = '';


                    if (stamp >= minutesAgo && stamp <= now) {
                        msg = 'Moments ago';
                    } else if (stamp >= hourAgo && stamp <= now){
                        msg = '1 hour ago';
                    } else {
                        msg = this.formatGMT(stamp, offset).toString();
                    }   

                    return msg;

                },
                formatGMT: function(stamp, offset){

                    var time;

                    // * 1000 gives us date string to format in Ext.Date class
                    if (offset > 0){
                        time = new Date((stamp - offset) * 1000);    
                    } else {
                        time = new Date((stamp + offset) * 1000); 
                    } 

                    return Ext.Date.format(time, 'd-M-y, H:i \\G\\M\\T');

                }                   
            }
        );
    },
    notifications: {
        flyout: function(){
            return new Ext.XTemplate(
                '<tpl for=".">',    
                    '<li id="notification-flyout-{id}">',
                        '<div class="data-details">',
                            '<p>{message}</p>',
                            '{[ this.renderTimeStamp(values.sentDate) ]}',   
                        '</div>',   
                    '</li>',   
                '</tpl>',
                {
                    renderTimeStamp: function(stamp) {
                        return SCB.RMWB.templates.timeStamp(stamp);
                    }               
                }
            );
        }
    }
};

タイムスタンプ関数を元のテンプレートに保持すると正常に機能しますが、この機能はさまざまなテンプレートのいくつかの場所で使用されるため、より一般的なものを再利用できるようにしたいと思います。

4

1 に答える 1

2

さて、私はあなたのコード例の中であなたをフォローするのにいくつかの困難がありますが、あなたがapplyあなたのテンプレートインスタンスを呼び出すときそれはあなたのために働くはずです。

詳細に：

ヘルパー名前空間内で一度再利用するテンプレートを作成します。再利用するには、提供されたデータとともにそのインスタンスを取得するメソッドを提供します。

var tpl = new Ext.Template('Name: {name}, Age: {age}');
tpl.apply({name: 'John', age: 25}); // returns a html string

ここに（より詳細な）JSFiddle

于 2012-12-20T13:54:58.957 に答える