先読みでこのオブジェクトにアクセスするにはどうすればよいですか？

Question

私はLaravel 5.3でtwitter先読みを使用しています。 、候補をプルダウンでデータのリモートソースJSON配列は、jsオブジェクトの配列にマッピングされる

[ 
    { 
    "id": 2, 
    "name": "iphone", 
    "created_at": "2017-02-08 06:12:34", 
    "updated_at": "2017-02-08 06:12:34", 
    "user_id": 1, 
    "brand_id": 1, 
    "msds_url": "google.com", 
    "gravity": 1.03, 
    "recipe_id": null, 
    "relevance": 210, 
    "brand": { 
     "id": 1, 
     "name": "apple", 
     "created_at": "2017-02-08 03:00:49", 
     "updated_at": "2017-02-08 03:00:49", 
     "user_id": 1, 
     "abbreviation": "AP", 
     "visible": 1 
    } 
    } 
] 

はvalueと呼ばれる：だけ知っているので、ここでの私のデータは、製品のためだとそのメーカーのブランド（FK）と一緒にそれは書かれたようにフォーマットされます「アップル - iPhone」いくつかのデータに、1、および2になりproduct.idだろうbrand.idを唱えている私は何もやってみたい

var engine = new Bloodhound({ 
    datumTokenizer: function(datum) { 
    return Bloodhound.tokenizers.whitespace(datum.value); 
    }, 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    remote: { 
    wildcard: '%QUERY', 
    url: '/find?q=%QUERY%', 
    transform: function(response) { 
    console.log(response); 
     // Map the remote source JSON array to a JavaScript object array 
     return $.map(response, function(product) { 
     return { 
      value: product.brand.name+' - '+product.name, 
      other: product 
     }; 
     }); 
    } 
    } 
}); 

// Instantiate the Typeahead UI 
$('#search').typeahead(null,{ 
    display: 'value',//choose a key from the map 
    highlight: true, 
    hint: true, 
    source: engine 
}); 

は同じ入力の属性、私はイベントを捕獲し、「選択した提案をログに記録しましたユーザーが取ったそれは、マップ関数内で、具体的にフォーマットされますので、

$("#search").on("typeahead:select", function(ev, suggestion) { 
    console.log(suggestion); 
}); 

問題は、それが私のデータの完全な配列へのアクセス権を与えないということであるブラッドハウンド部から

// Map the remote source JSON array to a JavaScript object array 
      return $.map(response, function(product) { 
      return { 
       value: product.brand.name+' - '+product.name, //this format 
       other: product //full access to object 
      }; 
      }); 

だから私はotherにdisplayを切り替えますvalueの代わりに、ブランド名と製品名の代わりに完全なオブジェクトが渡されるようにします。提案はドロップダウンに起動したとき、私は前とは違って、まだそれをアクセスしていないので、

$('#search').typeahead(null,{ 
    //display: 'value', 
    display: 'other', 
    highlight: true, 
    hint: true, 
    source: engine 
}); 

さて、それは[object object]を言うだろう。

オブジェクトにアクセスして適切にフォーマットし、ブランドIDと商品IDにアクセスするにはどうすればよいですか？これは、フォームを送信した後、選択した商品IDと商品テーブル項目を一致させるためのものです。

Answer 1

私はコードをチェックしていませんが、これは私のプロジェクトで動作しています。試してみてください：

var engine = new Bloodhound({ 
    datumTokenizer: function(datum) { 
     var result = Bloodhound.tokenizers.whitespace(datum.name); 
     if (datum.brand != null){ 
      result = result.concat(Bloodhound.tokenizers.whitespace(datum.brand.name)); 
     } 
     return result; 
    }, 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    remote: { 
     wildcard: '%QUERY', 
     url: '/find?q=%QUERY%', 
     prepare: function(query, settings) { 
      settings.type = "GET"; 
      settings.dataType = "json" 
      settings.url = settings.url.replace('%QUERY', encodeURIComponent(query)); 
      return settings; 
     } 
    } 
}); 

engine.initialize(); 

$("#search").typeahead(null, { 
    name: 'engine', 
    displayKey: function(data){ 
     return data.name + (data.brand ? " - " + data.brand.name : ""); 
    }, 
    source: engine.ttAdapter(), 
}) 
.on('typeahead:selected', function($e, datum){ 
    //You may access the value object here 
    console.log("datum" ,datum); 
}); 

もしうまくいけば教えてください。