数据订阅了 Knockout ObservableArray 但显示空数组

Question

我是 javascript 的新手。我很难从位置 ObservableArray 打印数据。数据绑定有效，我可以在视图中列出 ObservableArray 位置的数据，但无法在控制台上打印出来。我已经研究了几个小时了，如有任何帮助，我们将不胜感激。谢谢

这是 ViewModel

    let MapViewModel = function() {

let map
let geocoder;
let self = this;

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

for (let i = 0; i < locationList.length; ++i) {
  self.location.push(new Location(locationList[i]));
}

console.log(this.location()); // Location, Location, Location, Location, Location, Location, Location]
console.log(this.location()[0].name); //  Location {name: ƒ, address: ƒ} ...
console.log(this.location().length); //length is 7

}

let Location = function(data) {
this.name = ko.observable(data.name);
this.address = ko.observable(data.address);


}

  ko.applyBindings(new MapViewModel());

这是绑定代码`

  <div class="menu_item_container">
    <h1>Neighborhood Map</h1>
    <input type="text" id="search" data-bind= 'value:filterLocations, valueUpdate: 'afterKeyDown',value:filterLocations' placeholder="Search Locations...">
    <hr>
    <nav id=nav>
      <ul data-bind='foreach:location'>
        <li data-bind="text:name"></li>
      </ul>
    </nav>
  </div>

位置列表

  let locationList = [{
  name: 'Brooklyn Museum',
  address: '200 Eastern Pkwy, Brooklyn, NY 11238'
}, {
  name: 'Empire State Building',
  address: '350 5th Ave, New York, NY 10118'
}, {
  name: 'Statue of liberty',
  address: 'New York, NY 10004'
}, {
  name: 'Rockefeller Center',
  address: '45 Rockefeller Plaza, New York, NY 10111'
},
{
  name: 'Brooklyn Bridge',
  address: 'Brooklyn Bridge, New York, NY 10038'
},
{
  name: 'Time Square',
  address: '45 Rockefeller Plaza, New York, NY 10111'
},
{
  name: 'World Trade Center',
  address: '285 Fulton St, New York, NY 10007'
},
  ];

Answer 1

这可以将 observable 解包为常规 js 并将其转换为单个字符串（如果需要），然后您可以在控制台打印它：

let locationsJSON = ko.toJS(self.location);
let locationsString = JSON.stringify(locationsJSON);

数据订阅了 Knockout ObservableArray 但显示空数组

data subscribed to Knockout ObservableArray but displaying empty array

javascript

knockout.js

knockout-mvc