計數器頁面加載計數

我想建立一個簡單的計數器，將計數從0到100在頁面加載。這裏有一些我出來，但不工作。我會感激所有幫助感謝計數器頁面加載計數

App.AboutController = Ember.ObjectController.extend({ 
    count: 0, 
    content: 0, 
    counterUp: function() { 
     var count = this.get('count') + 1; 
     this.set('count', count); 
     this.set('content', count % 100); 
    } 
});

來源

2015-04-07 Jose CC

如何運行counterUp功能？如果它是一個來自模板的動作，你應該把它放在動作中：object –

所以計數器應該儘可能以頁面加載的速度啓動.... counterUp被放置在模板上 –

好吧，因爲解決方案進入了不同的方向：你想要在每個「頁面加載」上計數一個（x = x + 1），還是計數器應該在頁面加載時自動啓動（如非常基本的時鐘）？ – jnfingerle

這看起來像一個部件的最佳候選：

組件

App.TimerCounterComponent = Ember.Component.extend({ 
    tick: function() { 
    this.incrementProperty('count'); 
    if (Ember.isEqual(this.get('count'), 100)) { 
     this.killCounter(); 
    } else { 
     this.scheduleTick(); 
    } 
    }, 
    scheduleTick: function() { 
    this._counter = Ember.run.later(this, 'tick', 600); 
    }, 
    setup: function() { 
    this.set('count', 0); 
    this.scheduleTick(); 
    }.on('didInsertElement'), 

    killCounter: function() { 
    Ember.run.cancel(this._counter); 
    }.on('willDestroyElement') 
});

組件模板

Count: {{count}}

那麼要使用該組件的任何模板：

{{timer-counter}}

編輯：收拾了jsbin碼有點

獎金輪：full js-bin example

來源

2015-04-07 16:20:28

對於類似時鐘的解決方案，也可以使用https://www.npmjs.com/package/ember-cli-clock – jnfingerle

謝謝你的回答 –

你不能對控制器的財產計數，因爲它總是會重新初始化，你必須始終爲零。但是，您可以訪問應用程序控制器和這樣的屬性不會重置：

// better use Controller because ObjectController is getting deprecated 
App.AboutController = Ember.Controller.extend({ 
    needs: ['application'], 
    count: Ember.computed.alias('controllers.application.count'), 
    content: Ember.computed.alias('controllers.application.content'), 
    counterUp: (function() { 
    count = this.get('count') + 1 || 1; 
    this.set('count', count); 
    this.set('content', count % 100); 
    }).on('init') 
});

如果你願意，你可以初始化計數和內容性質是這樣的：

App.ApplicationController = Ember.Controller.extend({ 
    count: 0, 
    content: 0 
})

如果你已經使用了代理ObjectController使用的行爲可以用它替換Controller。

來源

2015-04-07 15:36:48

事情是這樣的，你的counterUp方法已經被聲明和定義，但從未被調用過。你必須在適當的鉤子中調用它。在http://emberjs.jsbin.com/wuxesosadi/1/edit?html,css,js,output中，您會找到一個例子，記錄您點擊該號碼的時間。

您想要在「加載頁面」時進行計數 - 重新啓動應用程序的整頁頁面會始終重置計數器。如果你的意思是過渡到路線，http://emberjs.jsbin.com/wuxesosadi/4/edit?html,css,js,output將是一個工作的例子。

這就是說，對於現實世界的問題，你可能會有一個計數器服務或模型中的數據。控制器應該只保存表示邏輯。即使控制器保存在內存中並重新使用（作爲一個單身人士），這感覺非常錯誤。再次，作爲事情如何運作的例子，這是完全有效的。

來源

2015-04-07 15:50:01 jnfingerle

只是爲了澄清遲到參加聚會的讀者：此解決方案適用於計算頁面加載次數的計數器。對於時鐘般的櫃檯，請參閱Kori John Roys的答案。 – jnfingerle

計數器頁面加載計數

回答

相關問題