Solvedcomponents [Table] - Add example with multiple filtering columns

<!-- repeat this to all columns -->
 <ng-container cdkColumnDef="Column1">
         <mat-header-cell *cdkHeaderCellDef>
                 <!-- instead of adding mat-sort-header directive to the mat-header-cell, i've move it on span tag to separate sorting and filtering icon .-->
                <span mat-sort-header>Column1 </span>
                 <!-- i've applied css rules to the icon-->
                <span (click)="onFilterClick('col1')" class="filter-icon">
                    <mat-icon>keyboard_arrow_down</mat-icon>
                </span>
                <filter-template [openFilter]="true" *ngIf="templateFor === 'col1' "></filter-template>
         </mat-header-cell>
         <mat-cell *cdkCellDef="let row">{{row.Column1}}</mat-cell>
   </ng-container>

<!-- filter-template component.html -->
<span #filterMenu="matMenuTrigger" [matMenuTriggerFor]="menu" id="filter-panel">

<mat-menu #menu="matMenu" [overlapTrigger]="false">
 <div (click)="$event.stopPropagation()" (keyup)="$event.stopPropagation()" (keydown)="$event.stopPropagation()">
   <form autocomplete="off"  (ngSubmit)="onFilterSubmit()" [formGroup]="filterForm">
			
    <mat-form-field  style="width: auto;">
	<mat-select formControlName="op" placeholder="Condition:">
		<mat-option *ngFor="let con of conditions" [value]="condi.id">
			 {{con.text}}
		</mat-option>
		</mat-select>
	</mat-form-field>
				
	<mat-form-field  *ngIf="!forFirstValue">
		<input formControlName="val1" matInput placeholder="Value">
	</mat-form-field>

	<mat-form-field class="font-sm" *ngIf="forSecondValue">
	   <input formControlName="val2" matInput placeholder="Second Value">
	</mat-form-field>
				
	<button [disabled]="hasNoValue" matRipple type="submit"></button>                
	</form>
  </div>
 </mat-menu>
</span>