mithril.js卡在循環呼叫控制器

我想POST一個令牌，並顯示結果作爲一個有序列表。我希望列表更新輸入的更改。在頁面加載請求POST被無限錯誤循環：mithril.js卡在循環呼叫控制器

TypeError: ctrl.keys(...) is undefined

我懷疑我的數據在控制器的工作原理結合的假設是完全錯誤的。

//component 
 
var tISM = {}; 
 

 

 
//model 
 
tISM = { 
 
\t Key: function(data) { 
 
\t \t this.Id = m.prop(data.Id); 
 
\t \t this.Name = m.prop(data.Name); 
 
\t \t this.CreationTime = m.prop(data.CreationTime); 
 
\t }, 
 

 
\t keys: function(token) { 
 
\t \t return m.request({ 
 
\t \t \t method: "POST", 
 
\t \t   \t url: "key/list", 
 
\t \t \t data: { "token": token }, 
 
\t \t \t type: tISM.Key 
 
\t \t }) 
 
\t }, 
 
}; 
 

 
//controller 
 
tISM.controller = function() { 
 
\t // when this controller is updated perform a new POST for data by calling message? 
 
\t var token = m.prop("xxx") 
 

 
\t var keys = function() { 
 
\t \t tISM.keys(this.token) 
 
\t } 
 
\t return { token, keys } 
 
}; 
 

 
//view 
 
tISM.view = function(ctrl) { 
 
\t return m("div"), [ 
 
\t \t m("ol", ctrl.keys().map(function(key, index) { 
 
\t \t \t return m("li", key.Id, key.Name, key.CreationTime) 
 
\t \t })), 
 
\t \t m("input", { 
 
\t \t \t onchange: m.withAttr("value", ctrl.token) 
 
\t \t }) 
 
\t ] 
 
}; 
 

 

 

 
//initialize 
 
m.mount(document.getElementById("app"), tISM);

<script src="http://cdnjs.cloudflare.com/ajax/libs/mithril/0.2.5/mithril.min.js"></script> 
 
<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <meta charset="UTF-8" /> 
 
    <title>Mithril App</title> 
 
    <script src="mithril.js"></script> 
 
    </head> 
 
    <body> 
 
    <div id="app"></div> 
 
    </body> 
 
</html>

來源

2016-10-26 Theodore Cowan

我的問題是我不知道的JavaScript。這工作：

//component 
 
var tISM = {}; 
 

 
//model 
 
tISM.Key = function(data) { 
 
\t this.Id = m.prop(data.Id); 
 
\t this.Name = m.prop(data.Name); 
 
\t this.CreationTime = m.prop(data.CreationTime); 
 
} 
 
tISM = { 
 

 
\t keys: function(token) { 
 
\t \t return m.request({ 
 
\t \t \t method: "POST", 
 
\t \t   \t url: "key/list", 
 
\t \t \t data: { "token": token }, 
 
\t \t \t type: tISM.Key 
 
\t \t }) 
 
\t }, 
 
}; 
 

 
//controller 
 
tISM.controller = function() { 
 
\t this.token = m.prop("") 
 
\t this.keys = m.prop([]) 
 

 
\t this.updateToken = function(token) { 
 
\t \t this.token(token) 
 
\t \t tISM.keys(this.token).then(this.keys) 
 
\t }.bind(this) 
 

 
}; 
 

 
//view 
 
tISM.view = function(ctrl) { 
 
\t return m("div"), [ 
 
\t \t m("input", { 
 
\t \t \t oninput: m.withAttr("value", ctrl.updateToken) 
 
\t \t }), 
 
\t \t m("ol", ctrl.keys().map(function(key, index) { 
 
\t \t \t return m("li", key.Id, key.Name, key.CreationTime) 
 
\t \t })), 
 
\t ] 
 

 
}; 
 

 

 
//initialize 
 
m.mount(document.getElementById("app"), tISM);

來源

2016-10-27 21:41:49

m.request（）返回一個延遲，而不是值本身。我在下面有一段代碼，顯示了一種獲取值的方法。我明確地用延期調用替換了m.request（），並使用超時而不是帖子。

//component 
 
var tISM = {}; 
 

 

 
//model 
 
tISM = { 
 
\t Key: function(data) { 
 
\t \t this.Id = m.prop(data.Id); 
 
\t \t this.Name = m.prop(data.Name); 
 
\t \t this.CreationTime = m.prop(data.CreationTime); 
 
\t }, 
 

 
keys: function(token) { 
 
    m.startComputation() 
 
    var d = m.deferred(); 
 
    setTimeout(function() { 
 
    d.resolve([1,2,3]); 
 
    m.endComputation(); 
 
    }, 1000); 
 
    return d.promise; 
 
} 
 
}; 
 

 
//controller 
 
tISM.controller = function() { 
 
\t // when this controller is updated perform a new POST for data by calling message? 
 
\t var token = m.prop("xxx") 
 

 
    var keys = m.prop([]); 
 
    tISM.keys(this.token).then(keys) 
 
    return { 
 
token: token, 
 
keys: keys 
 
    } 
 
\t return { token, keys } 
 
}; 
 

 
//view 
 
tISM.view = function(ctrl) { 
 
\t return m("div"), [ 
 
\t \t m("ol", ctrl.keys().map(function(key, index) { 
 
\t \t \t return m("li", key.Id, key.Name, key.CreationTime) 
 
\t \t })), 
 
\t \t m("input", { 
 
\t \t \t onchange: m.withAttr("value", ctrl.token) 
 
\t \t }) 
 
\t ] 
 
}; 
 

 

 

 
//initialize 
 
m.mount(document.getElementById("app"), tISM);

<script src="http://cdnjs.cloudflare.com/ajax/libs/mithril/0.2.5/mithril.min.js"></script> 
 
<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <meta charset="UTF-8" /> 
 
    <title>Mithril App</title> 
 
    <script src="mithril.js"></script> 
 
    </head> 
 
    <body> 
 
    <div id="app"></div> 
 
    </body> 
 
</html>

來源

2016-10-26 23:21:41 Jason

mithril.js卡在循環呼叫控制器

回答

相關問題