Legacy Product

Fusion 5.4

search:breadcrumbs

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

Param Type Details

response

(optional)

object

A response object

query

(optional)

string

A query object

group-by-field

(optional)

boolean

Group filters by field name (only available if query is not in grouping mode).

show-field-name

(optional)

boolean

Whether to show field name as a part of the breadcrumb (only available when group by field is true), Default:true.

show-query

(optional)

boolean

Whether to include the user query text as a breadcrumb. Default:true

max-characters

(optional)

number

Limit display value to a certain number of characters, adding ’…’ if maxCharacters is exceeded.

action

(optional)

string

Alternative page to submit the query parameters to - defaults to current page.

optional-label

(optional)

string

Label to show when the Filter is optional.

date-format

(optional)

string

Format to use for date values if no display value is specified. See #/api/lightning.filter:dateFormat[date format filter] for valid formats.

exclude

(optional)

string

Comma 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