将 @Html.Raw 替换为 Knockout

Question

我的观点如下：

<div class="attributes">
                @Html.Raw(item.AttributeInfo)
            </div>

item.Attribute 信息是 C# 视图模型的一部分。现在我用 KO 视图模型替换它，并且只有 AttributeInfo。那么，如何使用 KO 替换视图的指定部分？

Answer 1

像下面这样的东西应该可以工作...

<div class="attributes" data-bind="html: attributeInfo"></div>

<!-- assume KO is already included -->
<script>
  function ViewModel(attributeInfo){
    this.attributeInfo = ko.observable(attributeInfo || '');
  };
  ko.applyBindings(new ViewModel('@Html.Raw(item.AttributeInfo)'));
</script>

现在 HTML 仍然需要以某种方式输出到页面（因为 KO 在客户端运行，而模型就目前而言是在服务器端）。我也没有对 item.AttributeInfo 包含会使 JS 变形的内容（例如值中的 '）执行任何安全防护。

但是，您可以稍微清理一下（以及使用 KO 映射）并使其更干净一些：

@{
  IHtmlString modelJs = new HtmlString(
    JsonConvert.SerializeObject(
      item,
      Formatting.None,
      new CamelCasePropertyNamesContractResolver()
    )
  );
}
<div class="attribute" data-bind="html:attributeInfo"></div>
<script>
  var viewModel = ko.mapping.fromJS(@modelJs);
  ko.applyBindings(viewModel);
</script>

将 @Html.Raw 替换为 Knockout

Replace @Html.Raw with Knockout

asp.net-mvc

viewmodel

razor

knockout.js