allow to specify the display limit of search parameter suggestions

Author: dnauck

CHANGELOG.md

@@ -8,6 +8,7 @@
 * fixed entering the edit mode by clicking on a search parameter, fixed #3 #14 #21
 * fixed browser back behaviour when removing queries, pull request #23
 * add option to configure the suggested parameter label text
+* allow to specify the display limit of search parameter suggestions
 
 ### 1.1.1 - 03 February 2015
 * update README with latest changes to dist files in bower package

README.md

@@ -88,6 +88,10 @@ param can be a scope variable as well as a hard-coded string.
       <td>parameters</td>
       <td>List of available parameters to search for.</td>
     </tr>
+    <tr>
+      <td>parametersDisplayLimit</td>
+      <td>Maximum number of suggested parameters to display. Default is 8.</td>
+    </tr>
     <tr>
       <td>parametersLabel</td>
       <td>Text for the suggested parameters label, e.g. "Parameter Suggestions".</td>

src/angular-advanced-searchbox.html

@@ -33,12 +33,12 @@
                ng-focus="focus = true"
                ng-blur="focus = false"
                typeahead-on-select="typeaheadOnSelect($item, $model, $label)"
-               typeahead="parameter as parameter.name for parameter in parameters | filter:isUnsedParameter | filter:{name:$viewValue} | limitTo:8"
+               typeahead="parameter as parameter.name for parameter in parameters | filter:isUnsedParameter | filter:{name:$viewValue} | limitTo:parametersDisplayLimit"
                ng-change="searchQueryChanged(searchQuery)"
                ng-model="searchQuery" />
     </div>
     <div class="search-parameter-suggestions" ng-show="parameters && focus">
         <span class="title">{{parametersLabel}}:</span>
-        <span class="search-parameter" ng-repeat="param in parameters | filter:isUnsedParameter | limitTo:8" ng-mousedown="addSearchParam(param)">{{param.name}}</span>
+        <span class="search-parameter" ng-repeat="param in parameters | filter:isUnsedParameter | limitTo:parametersDisplayLimit" ng-mousedown="addSearchParam(param)">{{param.name}}</span>
     </div>
 </div>

src/angular-advanced-searchbox.js

@@ -18,6 +18,7 @@ angular.module('angular-advanced-searchbox', [])
                 model: '=ngModel',
                 parameters: '=',
                 parametersLabel: '@',
+                parametersDisplayLimit: '=',
                 placeholder: '@'
             },
             replace: true,
@@ -27,6 +28,7 @@ angular.module('angular-advanced-searchbox', [])
                 function ($scope, $attrs, $element, $timeout, $filter) {
 
                     $scope.parametersLabel = $scope.parametersLabel || 'Parameter Suggestions';
+                    $scope.parametersDisplayLimit = $scope.parametersDisplayLimit || 8;
                     $scope.placeholder = $scope.placeholder || 'Search ...';
                     $scope.searchParams = [];
                     $scope.searchQuery = '';