### File

`src/app/home/content/filter-summary/filter-summary.component.ts`

### Implements

`OnInit`

### Metadata

selector | `app-filter-summary`
styleUrls | `filter-summary.component.scss`
templateUrl | `./filter-summary.component.html`

### Constructor

`constructor(store: Store, search: SearchActions)`
Defined in src/app/home/content/filter-summary/filter-summary.component.ts:14

### Methods

ngOnInit
`ngOnInit()`
Defined in src/app/home/content/filter-summary/filter-summary.component.ts:21
Returns: `void`

removeFilter
`removeFilter(removedFilter: any)`
Defined in src/app/home/content/filter-summary/filter-summary.component.ts:24
Returns: `void`

### Properties

filters$
`filters$: `Observable<any>``
Defined in src/app/home/content/filter-summary/filter-summary.component.ts:14

    import { SearchActions } from './../../reducers/search.actions';
    import { getFilters } from './../../reducers/selectors';
    import { AppState } from './../../../interfaces';
    import { Store } from '@ngrx/store';
    import { Observable } from 'rxjs/Observable';
    import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';

    @Component({
      selector: 'app-filter-summary',
      templateUrl: './filter-summary.component.html',
      styleUrls: ['./filter-summary.component.scss']
    })
    export class FilterSummaryComponent implements OnInit {
      filters$: Observable<any>;

      constructor(private store: Store<AppState>,
        private search: SearchActions) {
        this.filters$ = this.store.select(getFilters);
      }

      ngOnInit() {
      }

      removeFilter(removedFilter) {
        this.store.dispatch(this.search.removeFilter(removedFilter));
      }

    }

    <div class="filter-summary">
      <div class="filter">
        <div
          *ngFor="let filter of filters$ | async"
          class="option"
          (click)="removeFilter(filter)">{{ filter.name }}
        </div>
        <!--<div data-filter="brands_filter_facet" data-option="Wills Lifestyle" data-colorhex="" class="option">Wills Lifestyle</div>-->
      </div>
    </div>

Legend
Html element
Component
Html element with directive

# results matching ""

# No results matching ""