淘汰赛帮助获取外部数据

Question

我刚刚完成了淘汰教程，现在我正在尝试从外部页面获取数据。

在教程中他们使用以下代码：

self.seats = ko.observableArray([
        new SeatReservation("Steve", "Standard (sandwich)", "34.95" ),
        new SeatReservation("Paul", "Standard (sandwich)", "14.95" )

       ])

我想更新它以从外部文件中拉取选项：

self.seats = ko.observableArray([
  
  $.get( "scripts/test.js", function( data ) {
  			
    
    
     $(data.data).each(function(index, result) { 
  
         new SeatReservation(result.name, result.mealName, result.price )
     })  
     
   })
     
     
  

  )]

测试结构在哪里：

var data = [
  {
    'mealName': 'Standard (sandwich)',
    'price': '0',
  },
  {
    'mealName': 'Main (sandwich)',
    'price': '34.95',
  }
];

我还需要做什么？

我已经在页面上包含了 jQuery 和 Knockout。

我还必须从 file:// 运行它，因为它需要发送到某个地方

---

所以我已经更新了我的代码来做到这一点

var newData = ko.utils.arrayForEach(data, function(item){
		console.log(item)
		console.log(item.firstName + " " + item.lastName + " " + item.price);
		
		return new SeatReservation(item.firstName, item.lastName, item.price);
        
		
	});
        console.log("here");    		
        console.log(newData);
	  	self.seats(newData);

控制台正在按预期记录项目的数据，但返回没有做任何事情，并且 console.log(newData) 返回未定义

为什么会这样？

Answer 1

就目前的情况而言，您正在丢弃 ajax 调用的结果。你需要做类似的事情

$.get( "scripts/test.js", function( data ) {
  self.availableMeals = data;
});

但是，由于self.availableResults 不是一个knockoutjs ObservableArray，页面将不会响应来自服务器通过ajax 调用的更改。

你会想做这样的事情。

self.seats= ko.observableArray();

$.get( "scripts/test.js", function( data ) {
  var newData = ko.utils.arrayForEach(data, function(item){
    return new SeatReservation("", item.mealName, item.price);
  });
  self.seats(newData);
});