Question

使用SignalR我向客户端发送具有此结构的对象数组

Url = s.Piece.Name,
Id = s.Id,
IsLighted = s.IsLighted,
Class = s.ColorType

javascript中的数组就像这样

self.CellList = ko.observableArray([]);

它以空白开始，当调用服务器函数时，它会像这样填充

function updateBoard(cellList) {
    viewModel.CellList.removeAll();
    for (var i = 0; i < cellList.length; i++) {
            viewModel.CellList.push(cellList[i]);
    }
};

在这样的cshtml页面中是否有可能？

CellList()[77].Url

Answer 1

如果您的意思是，如何在视图中显示可观察数组的结果，那么有几种方法可以继续：

＆＃13;

var data = [{
  Url: 's.Piece.Name',
  Id: 's.Id',
  IsLighted: 's.IsLighted',
  Class: 's.ColorType'
}, {
  Url: 's.Piece.Name2',
  Id: 's.Id2',
  IsLighted: 's.IsLighted2',
  Class: 's.ColorType2'
}];

var DemoPage = (function() {
  function DemoPage() {
    var self = this;
    self.CellList = ko.observableArray([]);
    self.updateBoard = function(cellList) {
      var _temp = [];
      for (var i = 0; i < cellList.length; i++) {
        // I've created a temporary array here, so knockout won't 
        // re-draw every time you push, then when we finally finish this loop
        // it's pushed to the right target
        _temp.push(cellList[i]);
      }
      self.CellList(_temp);
    }
  }

  return DemoPage;
})();

var demo = new DemoPage();

ko.applyBindings(demo);

demo.updateBoard(data);

＆＃13;

.result p {
  color: teal
}
.result {
  margin-top: 11px;
  border-top: 1px solid #bbb;
  padding-top: 11px;
}

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<p>Display individual item:</p>

<!-- ko if: CellList().length > 0 -->
<p data-bind="text: CellList()[0].Url"></p>
<!-- /ko -->

<p>Or just loop them:</p>
<!-- ko if: CellList().length > 0 -->
<div data-bind="foreach: CellList">
  <div class="result">
    <p data-bind="text: Url"></p>
    <p data-bind="text: Id"></p>
    <p data-bind="text: IsLighted"></p>
    <p data-bind="text: Class"></p>
  </div>
</div>
<!-- /ko -->

＆＃13;

请注意，我已经使用虚拟if绑定将它们包装起来 - 因为在初始化时，数组是空的，并且当时没有具有这些属性的对象。只有在数组中至少有1个元素时才显示它们。

您也可以使用映射，并将所有对象属性转换为可观察对象，然后可以在以后动态更改它们。

observablearray中的对象KnockoutJs

1 个答案: