Question

我的MVC 5（KnockoutJS和TypeScript）应用程序中有一个要求，我必须在用户更改标签时使用ajax加载一些部分视图。

主页面有一个视图模型，稍后当用户更改标签时应该处理部分视图的绑定。

问题是当我加载部分视图时，似乎绑定不起作用。

这些是我用来加载局部视图并在页面ViewModel类中应用绑定的函数：

class ExportViewModel
{
public isBusy: KnockoutObservable<boolean>;

private viewCache: { [key: string]: any } = {};

constructor()
{
    this.isBusy = ko.observable(true);
    this.getView('someId');
}

private showView(view: any): void
{
    var viewContent = $('#view-content');
    viewContent.html(view);
    ko.applyBindings(this, viewContent[0]);
    this.isBusy(false);
}

private getView(someId: string): void
{
    this.isBusy(true);
    var viewContent = document.getElementById('view-content');
    ko.cleanNode(viewContent);

    var viewName = someId;
    var view = this.viewCache[viewName];
    if(view)
        this.showView(view);

    jQuery.get(`BaseUrl/${viewName}`).done((data: any) =>
    {
        this.viewCache[viewName] = data;
        this.showView(data);
    });
}

}

示例局部视图如下：

    <div class="panel-body">
    @using( Html.BeginForm() )
    {
        <div class="row">
            <div class="col-md-12">
                <p>
                    Sample Partial View
                </p>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <input data-bind="textInput: isBusy"/>                    
            </div>
        </div>
    }
    </div>

在我的例子中，输入文本是isBusy可观察函数的内容，而不是true或false，如果我将输入绑定更改为＆＃34; textInput：isBusy（）＆＃34;那么值是 true 这是错误的，因为在applyBinding之后我将它设置为false。

Answer 1

我不知道为什么，但我将showView功能更改为以下内容，一切正常。

private showView(view: any): void
{
    var viewContent = document.getElementById('view-content');
    viewContent.innerHTML = view;
    ko.applyBindings(this, viewContent);
    this.isBusy(false);
}

在异步部分视图加载

1 个答案: