在typehead上获取id和名称

Question

我可以返回姓名和id，但我只能打印姓名。

我已经尝试过update和sfterslected

目前，我有这段代码，运行良好，但我只是得到了名字！

 $('input.typeahead').typeahead({
    source:  function (query, process) {
    return $.ajax({
    url: "search/autocomplete",
    type: "GET",
    data: "query=" + query,
    success: function(data) {

      var data = $.merge( $.merge( [], data['2'] ), data['1'] );
      return process(data); 
    }
    });

   }         
 });

预期的结果是获得给定的名称和id ( id应该打印在其他div中，例如#mydiv

提前感谢！

Answer 1

答案就是添加afterSelect

  $('input.typeahead').typeahead({
   source:  function (query, process) {
     return $.ajax({
     url: "search/autocomplete",
     type: "GET",
     data: "query=" + query,
     success: function(data) {

    var data = $.merge( $.merge( [], data['2'] ), data['1'] );

    return process(data); 

         // this returns an array checked with console
  }

});

},
 afterSelect: function(data){
    console.log(data.id);
}
 });

Answer 2

你可以用猎犬为typehead做一个指令。

app.directive('typeheadDirective', function() {
    return {
        restrict: 'A',
        scope: {
            themes: '=',
            output: '=',
        },
        link: function(scope, element, attrs) {
            var themes = new Bloodhound({
                datumTokenizer: Bloodhound.tokenizers.obj.whitespace('theme_name'),
                queryTokenizer: Bloodhound.tokenizers.whitespace,
                local: scope.themes,
            })
            element.typeahead(null, {
                name: 'themes',
                displayKey: function(item) {
                    return item.theme_name
                },
                source: themes.ttAdapter()
            })
            element.bind('typeahead:select', function(ev, theme) {
                scope.output = {
                    'id': theme.id,
                    /*'theme_id': theme.id,*/
                    'theme_name': theme.theme_name
                }
                // element.value = ''
                scope.$apply();
            })
        }
    };
});