Product Selector

Fusion 5.12
    Fusion 5.12

    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: {}
                }
            }]);