Angular Ui Bootstrap Typeahead Does Not Working For Filter And Orderby

Is there any option to use typeahead search the item name when the item details are coming from another JSON object ? Demo: http://codepen.io/anon/pen/PGWvmE The other filter and o

Solution 1:

similar idea: first modify the data:

functionpreprocess(expenses) {
  for (var i = 0; i < expenses.length; i++) {
    var expense = expenses[i];
    expense.item = $scope.theItems[expense.item_id].name;
    expense.model = $scope.theModels[expense.model_id].name;
    expenses[i] = expense;
  }
  return expenses;
}

$scope.expenses = preprocess($scope.expenses);

  $scope.theItemsArray = $.map($scope.theItems, function(val, index) {
    return [val.name];
  });

  $scope.theModelArray = $.map($scope.theModels, function(val, index) {
    return [val.name];
  });

then modify the html:

uib-typeahead="item for item in theItemsArray | filter:$viewValue | limitTo:8"

uib-typeahead="model for model in theModelArray  | filter:$viewValue | limitTo:8"


<th ng-click="changeSort('model')">Model

<td>{{expense.item}}</td>
<td>{{expense.model}}</td>