Knockout observable 未渲染到屏幕 [重复]答案

【问题标题】：Knockout observable not rendering to screen [duplicate]Knockout observable 未渲染到屏幕 [重复]
【发布时间】：2025-12-27 20:35:07
【问题描述】：

我有一个通过 ajax 返回 JSON 对象的应用程序。我试图将这些对象传递给 DOM，但有些东西不起作用。这是淘汰码

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 中。我还在可观察的面板中放置了一个“测试”占位符。这会按预期传递到 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")

    }

有什么想法吗？

【问题讨论】：

标签： javascript knockout.js

【解决方案1】：

您正在用 ajax 调用返回的纯值替换可观察对象。您需要使用当前的 observable 函数来更新值（从内存中，但我相信它会起作用）。

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

【讨论】：