MVC4 部分视图中的淘汰赛绑定

2024-02-21

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

作为一个出色的菜鸟(更广泛地说,是真正的网络开发者),我很可能在这里缺少一个常见的 javascript 概念模式,但我遇到的情况很像下面这样。我在服务器上有一个视图模型,让我们说一下:

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 部分(与服务器紧密耦合)中发生了很多事情,我不愿意提供向上。 (其次,我现在试图保持部分尽可能松散耦合 - 至少在客户端上 - 即使我在绑定/等方面受到了一些性能影响。)

(我认为)我真正追求的是一种将某种形式的范围传递给局部视图的方法,以便子视图局部视图将引用主局部视图模型(同样),而不必污染全局命名空间或使用唯一的名称。有没有办法让我说表示一个客户端 JS 变量,该变量将引用子/父部分中的对象? (或者我完全没有抓住重点,还有更好的方法吗?)


从长远来看,最好还是硬着头皮使用映射插件的经典组合、渲染到页面中进行初始化的顶级视图模型的 JSON 表示形式以及子视图模型的模板。但我理解你对现有 MVC 部分逻辑的痛苦,所以……

您当前是否正在渲染一个单独的脚本块作为每个子局部视图的一部分以创建其 Knockout 视图模型并应用其绑定?

您是否不能摆脱单个绑定上下文,并在页面中定义某种模块,该模块拥有顶级视图模型,并在子局部渲染时将其子视图模型增量添加到其中,然后添加到页面底部,在 DOM 准备好后,应用绑定吗?

因此,每个子部分的脚本块都会调用模块上的某个函数,并传入子模型的原始 JSON,其中包括其 Guid 键。然后,您的模块创建子视图模型的新实例,并将父视图模型设置为其中的引用,并将其推送到父视图模型上的子视图模型的可观察数组中。然后你就各有一个参考。

我不确定您是否可以解决此结构的某种页面级管理器(如果这就是您不污染全局命名空间的意思)。无论如何,让这些部分视图模型全部归单个对象所有而不是漂浮在全局命名空间中不是很好吗? (如果他们是)

希望我正确理解你的上下文。

更新:从某种意义上说,您的部分仍然是松散耦合的。标记中的绑定表达式显然必须与子视图模型的实例相关,但这可以是通过待办事项列表项或其他内容上的 foreach 向下链接的数据上下文,也可以使用“with”表达式显式设置,例如与 someOtherModule.randomStandaloneSubViewModel

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

MVC4 部分视图中的淘汰赛绑定 的相关文章

随机推荐

  • Laravel:PHPUnit 导致所有内容出现 404

    我正在尝试使用 PHPUnit 为我的 Laravel 应用程序运行一些基本的单元测试 然而 所有 HTTP 请求都会返回 404 not find HTTP 状态代码 因此我们在第一个障碍上失败了 在互联网上搜寻后 我找到了有关如何解决此
  • 在 Java 中将 JSON 响应转换为字符串?

    当我向 api 发出 API 请求时 我收到 JSON 格式的响应 当我这样做时我得到了这个System Out Println的响应 HTTP 1 1 200 OK Date Thu 04 Oct 2012 20 33 18 GMT Se
  • 无法加载可部署 .jar 中的主类

    我正在尝试构建一个可执行的 jar 并收到错误Error Could not find or load main class com company app Main 我已经重新启动了我的电脑并尝试清理这个项目 我也尝试过使用
  • 如何使用 Spring Boot 2.1 Webflux 定制 Netty?

    我想在我的 Spring Boot Webflux 项目中自定义 Netty 在我的 POM 中 我添加了 Spring Boot Webflux 和 Spring Boot Actuator 依赖项 接下来 我重写了 WebServerF
  • 为什么在大多数用户代理默认样式表中
    的字体大小比

    小?

    The default h5 and h6 章节标题 https www w3 org TR html5 rendering html sections and headingsHTML5 中的字体大小为0 83em and 0 67em

  • 如何在 Web 服务调用中输入凭据(授权对象)?

    我听从了建议此处提供 https stackoverflow com questions 14532299 how to design a soap call in matlab它就像一个魅力 现在 我正在连接到服务器并调用名为的方法获取功
  • 如何在 PL/SQL 中以编程方式设置表名称?

    我创建了以下简单的 PL SQL 存储过程示例来提出特定问题 此过程将员工姓名和 ID 号插入到名为的表中employees 这 下面解释 PROCEDURE hire employee emp id IN INTEGER name IN
  • 导航抽屉中的 SeekBar

    我想在导航抽屉中使用搜索栏 基本上我需要左右滑动来设置搜索栏 好吧 你猜对了 它会滑动导航抽屉 我想做的是在聚焦时滑动搜索栏 在未聚焦时滑动导航抽屉 我该怎么做呢 这是我设置项目时的代码 我还没有设置搜索栏 private View onC
  • 如何在 AMD/ATI GPU 上运行 TensorFlow?

    读完本教程后https www tensorflow org guide using gpu https www tensorflow org guide using gpu我用这个简单的代码检查了 GPU 会话 import numpy
  • 无法连接到远程 SQL 服务器

    我的一个客户给了我一个完全合格的服务器名称 servername somedomain net尝试通过 VPN 连接到其 SQL Server 实例 所以我尝试使用他们给我的用户名和密码 没有运气 我可以 ping 通但无法连接 收到用户名
  • 如何将 float* 数组绑定到 cuda 中的一维纹理?

    我试图了解如何通过将纹理内存绑定到线性设备数组 而不是 cudaArray 来使用它 我的代码很简单 如下 我有一个包含 8 个数字的 float 数组 我试图将其绑定到 1D 纹理 然后在我的内核函数中尝试读取纹理并将值放入输出数组中 但
  • Typescript 和 Google 关闭

    我使用 Typescript 命令 tsc 创建一个包含所有平台类的 Javascript 文件 tsc Main ts out script myProject debug js declarations 然后 我想用 Google Cl
  • 将 Android Studio 更新到 2020.3.1 Canary 14 Build 后未解决的 Kotlin 引用

    我目前遇到 Android Studio 警告我某些不存在的 Kotlin 函数 我认为这是 Android Studio 唯一的问题 因为我可以很好地编译和运行我的项目 例如Android Studio无法识别val rows mutab
  • 如何使用 ASP.NET 5 注册 OData

    我有一个 ASP NET 5 应用程序 我想将 OData v4 与它一起使用 这是我尝试过的 1 我导入了以下nuget包 Microsoft AspNet WebApi 5 2 3 Microsoft AspNet OData 5 7
  • Mapbox 中路线的多色折线

    我用我的应用程序记录路线 主要是摩托车路线 并希望根据路线每个点的速度为其着色 基本上我知道如何在 Mapbox 中做到这一点 这就是问题所在 由于您只能为一条折线设置颜色 因此我必须将速度部分中的路线分开 并使用其特定的颜色打印每个路线部
  • WSO2ESB 4.5.1 axi2 属性 ssl.client.auth.cert.X509 始终为 NULL

    当使用NIO SSL监听器 org apache synapse transport nhttp HttpCoreNIOSSLListener 时 没有HttpServletContext不再可用 显然 因此深入研究可能解决我发现的客户端证
  • 如何在 aws elastic beanstalk 环境实例启动上运行 shell 脚本

    我正在使用 Terraform 脚本创建 aws elastic beanstalk 环境 我需要在实例启动时启动 shell 脚本 我已经尝试过以下操作 resource aws elastic beanstalk environment
  • 无边框 TabControl wpf (XP)

    我在 WPF 中设置 TabControl 样式时遇到视觉问题 因此 即使我将选项卡控件的边框设置为 0px 且透明 右侧和底部边框上仍然有一条非常细的线 我没有找到可以解决这个问题的属性 所以也许有人遇到了同样的问题并可以分享 提前致谢
  • LibGDX指导-精灵追踪2D无限随机贝塞尔曲线

    我已经能够将平滑的动画应用于我的精灵并使用加速度计控制它 我的精灵固定为沿 x 轴左右移动 从这里开始 我需要弄清楚如何创建一条垂直的无限波浪线供精灵尝试追踪 我的游戏的目的是让用户用加速度计控制精灵的左 右移动 试图尽可能地追踪永无止境的
  • MVC4 部分视图中的淘汰赛绑定

    简而言之 我相信我所追求的是一种在 MVC4 部分视图中为剔除绑定 javascript 对象提供范围 上下文的方法 这样我就可以重用相同的部分而不会让它们互相干扰 但仍然能够在客户端引用父子视图模型 作为一个出色的菜鸟 更广泛地说 是真正