Skip to main content

Description

The Breadcrumbs directive.

Usage

as element:
<search:breadcrumbs
       [response="{object}"]
       [query="{string}"]
       [group-by-field="{boolean}"]
       [show-field-name="{boolean}"]
       [show-query="{boolean}"]
       [max-characters="{number}"]
       [action="{string}"]
       [optional-label="{string}"]
       [date-format="{string}"]
       [exclude="{string}"]>
</search:breadcrumbs>

Directive info

  • This directive creates new scope.

Parameters

ParamTypeDetails
response (optional)objectA response object
query (optional)stringA query object
group-by-field (optional)booleanGroup filters by field name (only available if query is not in grouping mode).
show-field-name (optional)booleanWhether to show field name as a part of the breadcrumb (only available when group by field is true), Default:true.
show-query (optional)booleanWhether to include the user query text as a breadcrumb. Default:true
max-characters (optional)numberLimit display value to a certain number of characters, adding ’…’ if maxCharacters is exceeded.
action (optional)stringAlternative page to submit the query parameters to - defaults to current page.
optional-label (optional)stringLabel to show when the Filter is optional.
date-format (optional)stringFormat to use for date values if no display value is specified. See date format filter for valid formats.
exclude (optional)stringComma separated list of fields to exclude, you can also use field=value to exclude only fields with the value provided.

Example

Source

<tk-example>
    <search:breadcrumbs response="response" group-by-field="true" date-format="shortDate" exclude="problem"></search:breadcrumbs>
</tk-example>
<tk-code-wrapper>
    <code hljs><search:breadcrumbs response="response" group-by-field="true" date-format="shortDate"></search:breadcrumbs></code>
</tk-code-wrapper>
angular.module('lightning')
.controller('ExampleController', ['$scope','$timeout', function($scope,$timeout) {
            $scope.response = {
                page: 2,
                query: {
                    rpp: 50,
                    filters:[
                        {
                            field:'file type',
                            val:'pdf'
                        },
                        {
                            field:'type',
                            val:'man'
                        },
                        {
                            val:{
                                act: {
                                    type: "range",
                                    from: "2016-08-05T12:50:30.660",
                                    to: "2016-08-10T12:50:40.509",
                                    fromExcluded: false,
                                    toExcluded:false
                                },
                                dsp:'2016-08-05T12:50:30.660Z - 2016-08-10T12:50:40.509Z'
                            },
                            field:'date'
                        },
                        {
                            val: {
                                act: {
                                    type: "range",
                                    from: 100,
                                    to: "200",
                                    fromExcluded: false,
                                    toExcluded: false
                                },
                                dsp: '100 - 200'
                            },
                            field: 'numbers'
                        },
                        {
                            val: {
                                act:'foo',
                                dsp:'bar'
                            },
                            field:'problem'
                        }
                    ]
                },
                facets: {}
            }
        }]);

Result

Result
I