無法使用「數據綁定=源：」

Question

將Kendo移動ListView綁定到數據我試圖將列表視圖綁定到ViewModel。我已將一些硬編碼數據放入代碼中，以確保它不會成爲Web服務的問題。我沒有看到任何控制檯錯誤，所以我不知道如何解決這個問題。

理想情況下，我希望儘可能多地處理獲取ViewModel中的數據的代碼，並且希望儘可能地保持您應該使用KendoUI Mobile框架的方式。

的Html

<div data-role="view" id="contactView" data-model="ContactViewModel" data-init="dataInit"> 
    <h1 id="ContactHallo">Contact Screen</h1> 
    <ul id="contactDetailList" 
     data-role="listview" 
     data-style="inset" 
     data-template="contactDetailtemplate" 
     data-bind="source: rdata"> 
    </ul> 
</div> 

的JavaScript

var ContactViewModel = kendo.observable({ 
     rdata: null, 

     loadData: function() { 
      var testData = [ 
           { 
            AssociatedContactType: "n\/a", 
            AssociatedProperties: [], 
            EmailAddress: "n\/a", 
            FName: "User1", 
            HomeNumber: "n\/a", 
            LName: "LastName", 
            MobileNumber: "+27 21 0823219213", 
            WorkNumber: "n\/a" 
           }]; 
      var loadedData = new kendo.data.DataSource.create({ data: testData }); 
      loadedData.read(); 

      this.rdata = loadedData; 
     } 
    }); 

    function dataInit() { 
     ContactViewModel.loadData(); 
    } 

    var app = new kendo.mobile.Application($(document.body)); 

模板

<div> 
    <h4>Added Record</h4> 
    <a href="tel:#:data.MobileNumber#">#:data.MobileNumber#</a> 
</div> 

Answer 1

這將是有趣的，知道爲什麼有人向下投原來的問題..

我蓋這個在我的博客文章之一：Kendo Mobile Gotchas, Tips, and Tricks。

的MVVM數據綁定實際發生之前的事件init，所以你ContactViewModel.rdata仍然null當綁定發生。但是，我認爲，如果你正確地調用.set()設置RDATA時，它可能會解決您的問題：

loadData: function() { 
    ... 
    this.set('rdata', loadedData); 
} 

設定應觸發ListView的更新，因爲rdata被設定。

---

如果不工作，那麼你可以得到真正棘手和做自己，而不是使用data-model聲明延遲MVVM數據綁定，直到init事件。

爲了做到這一點，你會從您的視圖中刪除data-model=屬性，而不是手動調用kendo.bind()你init函數的末尾，就像這樣：

<div data-role="view" id="contactView" data-init="dataInit"> 

function dataInit(initEvt) { 
    ContactViewModel.loadData(); 
    kendo.bind($(initEvt.view.element), ContactViewModel, kendo.mobile.ui); 
}