Использование нокаута с ассоциативным массивом

Question

Я довольно новичок в использовании нокаута JS, поэтому любая помощь будет очень признательна! Поэтому в основном я получил данные, поступающие в так:

[{ 
    "gjr":{ 
     "id":"gjr", 
     "firstname":"one", 
     "companyid":"ff05t5", 
     "companyname":"GMC" 
    }, 
    "68g":{ 
     "id":"68g", 
     "firstname":"two", 
     "companyid":"ff05t5", 
     "companyname":"GMC" 
    }, 
    "ghj":{ 
     "id":"ghj", 
     "firstname":"three", 
     "companyid":"a23atr", 
     "companyname":"Ford" 
    }, 
    "68f":{ 
     "id":"68f", 
     "firstname":"four", 
     "companyid":"ff05t5", 
     "companyname":"GMC" 
    }, 
    "f78":{ 
     "id":"f78", 
     "firstname":"five", 
     "companyid":"gjd94d", 
     "companyname":"Jaguar" 
    }, 
    "fh5":{ 
     "id":"fh5", 
     "firstname":"six", 
     "companyid":"gjd94d", 
     "companyname":"Jaguar" 
    } 
}] 

и то, что я пытаюсь сделать, это заполнить таблицу с этими данными, так что это будет выглядеть примерно так:

ID  FirstName   CompanyID   CompanyName<br/> 
gjr  one    ff05t5   GMC<br/> 
68g  two    ffo5t5   GMC<br/> 
ghj  three    a23atr   Ford<br/> 

и т.д. ...

Мне было интересно, если это возможно, используя нокаут js или есть лучший метод? У меня JSFiddle с тем, что я получил до сих пор:

http://jsfiddle.net/GJ7qH/15/

Answer 1

.observableArray метод принимает только массив, null или undefined.

Error: The argument passed when initializing an observable array must be an 
array, or null, or undefined. 

Вы должны обработать свои данные, чтобы подготовить массив объектов.

Here - это то, что я изменил на ваш код, чтобы он работал нормально. Проверьте это!

Надеюсь, это поможет.

Answer 2

без использования каких-либо инструментарий/Библиотеки/рамок любого рода, это уже есть (должна быть) довольно простой задачей.
Прежде всего, обратите внимание, что у JS нет ассоциативных массивов, у него есть массивы (которые, в сущности, дополненные объекты) и объекты. Вы имеете дело с последним.

Вот как я это сделать:

var data = yourData[0],//your data is an array, containing a single object literal 
    header = []; 
    tbl = {}, 
    p, p2; 
for(p in data) 
{ 
    if (data.hasOwnProperty(p)) 
    { 
     for (p2 in data[p]) 
     { 
      if (data[p].hasOwnProperty(p2)) 
      { 
       if (!tbl.hasOwnProperty(p2)) 
       { 
        header.push(p2);//add header value 
        tbl[p2] = [];//create array 
       } 
       tbl[p2].push(data[p][p2]); 
      } 
     } 
    } 
} 

Тогда у вас есть header массив, в котором перечислены все ключи, доступные для Вас, и в tbl объекта, вы найдете множество значений, которые идут с каждым ключ. Должно быть довольно легко написать цикл, который выводит только то, что вам нужно распечатать.
Кроме того, вы можете использовать header массив и генерировать выходные строки «в реальном времени»:

var data = yourData[0],//your data is an array, containing a single object literal 
    header,//leave undefined 
    row = [], 
    tbl = [], 
    p, i, p2; 
for(p in data) 
{ 
    if (data.hasOwnProperty(p)) 
    { 
     if (header === undefined) 
     { 
      header = []; 
      for (p2 in data[p]) 
       header.push(p2); 
      tbl.push(header.join("\t")); 
     } 
     for (i=0;i<header.length;++i) 
      row.push(data[p][header[i]]); 
     tbl.push(row.join("\t")); 
     row = [];//re-initialize 
    } 
} 
console.log(tbl.join("\n"));//should be pretty accurate 

Теперь это будет работать все браузеры я знаю, в том числе вшивый старый IE в том, что некоторые люди настаивают на том, сверху используя. Если вы не заботитесь много для этих браузеров (я не, в любом случае), вы можете легко записать так:

var data = yourData[0],//your data is an array, containing a single object literal 
    header;//leave undefined 
    str = '';//output string 
    p, i; 
for(p in data) 
{ 
    if (header === undefined) 
    {//first time over 
     header = Object.getOwnPropertyNames(data[p]); 
     str = header.join("\t") + "\n";//stringify, tab separated, add new line 
    } 
    for (i=0;i<header.length;++i) 
     str += data[p][header[i]] + "\t";//add value 
    str += "\n"; 
} 
console.log(str);//should be close to what you need 

Отказ
Я написал этот код с верхней части моей головы, ни один из них не был протестирован, поэтому перед вами все еще есть какая-то отладочная работа. Все три этих фрагмента, IMO, довольно понятны, но не стесняйтесь задавать более подробную информацию о данном заявлении, если это не совсем понятно.

Примечание:
После добавления этого отказ от ответственности, я на самом деле проверить последний фрагмент кода я дал здесь, в моей консоли, результат я получил:

 
id firstname companyid companyname 
gjr one ff05t5 GMC 
68g two ff05t5 GMC 
ghj three a23atr Ford  
68f four ff05t5 GMC 
f78 five gjd94d Jaguar 
fh5 six gjd94d Jaguar 

Который, форматирование asside, кажется, что вы после