相关疑难解决方法(0)

简而言之,我相信我所追求的是一种为MVC4局部视图中的敲除绑定/ javascript对象提供范围/上下文的方法,这样我可以重用相同的部分而不会让它们相互干扰,但仍然能够客户端的引用父子视图模型.

作为淘汰赛菜鸟很有可能(而且更广泛的是网络开发)我在这里缺少一个常见的javascript概念模式,但我遇到的场景非常类似于以下内容.我在服务器上有一个viewmodel,让我们说:

public class MainModel 
{
    // Other fields 

    SubviewModel Subview { get; set}
}

public class SubviewModel 
{
    // Relevant subview fields
}

然后在强类型(主)部分视图中,我呈现我需要的任何内容,并通过@ Html.Action将子视图模型传递到强类型部分(在服务器上).在这两种情况下,我都是通过做这样的事情来设置淘汰赛:

var mvcModel = ko.mapping.fromJS(@Html.Raw(JsonConvert.SerializeObject(this.Model)));

ko.applyBindings(mvcModel , document.getElementById("@("divSubview"+Model.Guid)"));

在这种情况下,divSubview将是部分的主要包装div,一切都通常绑定得很好 - 差不多.

Model.Guid连接是为了解决第一个问题,即这些部分通常在不同视图模型的页面上呈现几个.(把它想象成一个项目列表,一个待办事项列表或诸如此类的东西,每个项目都有可能改变的子内容 - 你得到了这个想法,可能在我试图进一步解释之前......)所以当多个局部渲染在同一页面上时,如果div没有唯一命名,如果我通过document.getElementById调用applyBindings,我最终将第二个viewModel应用于具有该名称的第一个渲染div.

第二个问题是相关的,因为当我渲染主要部分(对于给定页面有多个),然后是子视图时,我经常想要引用子视图中的主视图模型或同样.我一直在使用的解决方法是设置一个命名的全局参数,然后使用它来回传递,因为我知道脚本将按顺序执行 - 但这非常hacky.

那么我错过了什么是正确的解决方案？

我知道我可以使用Knockout的模板和一个更大的视图模型,最终可能是正确的解决方案,但是现在MVC部分(紧密耦合到服务器)有很多事情我不愿意给出起来.(其次我试图将部分内容尽可能松散地连接起来 - 至少在客户端上 - 即使我在绑定/等方面受到一点性能影响.)

(我认为)我真正想要的是将某种形式的范围传递给partials的方法,以便subview partial将引用主要的部分viewmodel(同样),而不必污染全局命名空间或使用unique名.有没有办法让我说一个客户端JS变量,它会引用子/父部分中的对象？(或者我完全忽略了这一点,还有更好的方法吗？)

我有一个表,通过Knockout js数据绑定.在每一行上都是一个链接,我希望显示一个模态对话框,其中包含也将与我的视图模型绑定的输入字段.

这是我的服务器端视图模型

public class ViewModel
{
    ...//String getters/setters
     public IList<SubViewModel> SubViewModels{get;set;} // contains a couple of String properties
     ...
}

然后,我在客户端中成功地序列化它并绑定到表.每个表行都有一个链接:

<script type="text/html" id="myRowTemplate">
    <tr>
    <td><a href="#" data-bind="click: function(){ myModel.doStuffInADialog($data) }">Do stuff in a popup</a></td>
... other editable text fields, all playing nicely

正确调用此函数,但我想将当前选定的行数据传递给模板:

var viewModel = {
    ...
    doStuffInADialog: function (selectedRowData) {
        //how to pass this selectedRowData to the template?
        d.dialog({ ... jquery dialog stuff });
        ...

这是我想要使用的模板:

<script type="text/html" id="nestedPropertyTemplate">
    <div class="form-row">
        <div>
            <label>${someFieldOnNestedProperty}</label>
        </div>
        <div class="field"> …