2015-06-19 95 views
0

我有一個應用程序通過ajax返回一個JSON對象。我正在嘗試將這些對象傳遞給DOM,但某些內容不起作用。這裏是淘汰賽代碼Knockout observable不能渲染到屏幕

function PanelViewVM() { 
    var self = this; 


    self.Panel = ko.observable("test"); 
    self.Source = ko.observable(); 


    self.SelectPanel = function() { 

     $.ajax("/DPanel/FillIndex", { 

      dataType: 'json', 
      contentType: 'application/json', 
      success: function (data) { 


       self.Panel = data.PanelDetails[0].Panel; 
       self.Source = data.PanelDetails[0].Source; 



       //ko.mapping.fromJS(data.PanelDetails, {}, self.PanelDetails); 

      }, 
      error: function (data) { 
       console.log(data); 
      } 
     }); 

    }; 

    self.SelectPanel(); 

}; 

ko.applyBindings(new PanelViewVM()); 

當我運行在VS的代碼,並放置在休息Ajax請求的結束,它指出self.Source和self.Panel已分配的數據。但是,這並不反映在DOM中。我還在小組observable中放置了一個「測試」佔位符。按預期傳遞給DOM。

@using System.Web.Optimization 
@{ 
    ViewBag.Title = "Index"; 
} 

<h2>Index</h2> 

<div class="row"> 
    <p>Panel:<strong data-bind="text: Panel"></strong></p> 
    <p>Source:<strong data-bind="text: Source"></strong></p> 



</div> 





@section Scripts { 

@Scripts.Render("~/bundles/knockout") 
@Scripts.Render("~/Scripts/ViewModel/PanelViewVM.js") 

    } 

任何想法?

回答

1

您正在用ajax調用返回的普通值替換可觀察對象。你需要使用當前的observable函數來更新值(從內存中,但我相信它會起作用)。

success: function (data) { 
    self.Panel(data.PanelDetails[0].Panel); 
    self.Source(data.PanelDetails[0].Source); 
}, 
+0

現貨上。謝謝 – user1781272