javascript - 2 番目の変数を使用して typehead.js で結果をフィルタリングするにはどうすればよいですか?

Question

Typeahead.js を使用して結果をフィルタリングしようとしています。現在、activity_title というフィールドを使用して結果をフィルター処理できます。これはうまくいきます。

2 番目の値で結果をフィルタリングするにはどうすればよいですか? この場合、特定の値の activity_level を持つ結果のみを選択したいと思います。ブラッドハウンドの初期化にハードコーディングするのではなく、タイプアヘッドが初期化されるときにこれを設定する必要があります（たとえば、使用したくないurl: 'api/activity/&range=1,3'）

リモートでアクセスする次の有効な JSON があります。

{
"meta": [
    {
        "name": "activity_id",
        "table": "table",
        "max_length": 4
    },
    {
        "name": "activity_title",
        "table": "table",
        "max_length": 91
    },
    {
        "name": "activity_level",
        "table": "table",
        "max_length": 2
    }
],
"detail": [
    {
        "activity_id": "57",
        "activity_title": "Help old ladies to cross the road.",
        "activity_level": "2"
    },
    {
        "activity_id": "58",
        "activity_title": "Help mum with the washing up.",
        "activity_level": "3"
    },
    {
        "activity_id": "59",
        "activity_title": "Shine my shoes",
        "activity_level": "1"
    },
    {
        "activity_id": "60",
        "activity_title": "Put the bins out",
        "activity_level": "1"
    }
]
}

次のように Bloodhound インスタンスをセットアップしました。

var activities = new Bloodhound({
   datumTokenizer: function (datum) {
       return Bloodhound.tokenizers.whitespace(datum.activity_title);
},
queryTokenizer: Bloodhound.tokenizers.whitespace,
prefetch: {
    url: '/api/activity/',
    filter: function(data) {
    return $.map(data['detail'], function(detail) {
        return {
            activity_id: detail.activity_id,
            activity_title: detail.activity_title,
            objective_level: detail.objective_level
        }; 
     });
   }
  }
});

Typeahead.js を使用して、入力時にデータを検索します。

$( document ).on( "focus", ".typeahead-init", function() {

// + '&range=' + minimum + ',' + maximum
var minimum = $('#group-level-min-1').val();
var maximum = $('#group-level-max-1').val();

$(this).typeahead({
  highlight: true
},
{
  name: 'activity_title',
  displayKey: 'activity',
  source: activities.ttAdapter(),
  templates: {
    header: '<div class="header-name">Activities</div>',
    empty: [
      '<div class="empty-message">',
      'No activities match your search',
      '</div>'
    ].join('\n'),
    suggestion: Handlebars.compile('<div class="typeahead-activity" id="typeahead-activity-{{activity_id}}"><strong>{{objective_level}}</strong> - {{activity_title}}</div>')
  }
})
//info on binding selection at https://github.com/twitter/typeahead.js/issues/300
.bind('typeahead:selected', function(obj, datum, name) {      
    var target = $(this).closest('.activity-container');

        var activityId = datum['activity_id'];
        var url = '/api/activity/id/'+activityId;
        $(target).children('.activity-id').val(activityId);

        //http://runnable.com/UllA9u8MD5wiAACj/how-to-combine-json-with-handlebars-js-for-javascript-ajax-and-jquery
        var raw_template = $('#activity-output').html();
          // Compile that into an handlebars template
          var template = Handlebars.compile(raw_template);
          // Fetch all data from server in JSON
          $.get(url,function(data,status,xhr){
            $.each(data,function(index,element){
              // Generate the HTML for each post
              var html = template(element);
              // Render the posts into the page
              target.append(html);
            });
          });

});
$(this).removeClass("typeahead-init");
$(this).focus();
});

これは、Stackoverflow などのいくつかの回答からまとめられています。どんな助けでも大歓迎です。