On Wednesday, 27 January 2016 15:14:18 UTC+5:30, HansMeise wrote:
>
> I have a normal <table> with <tr> filled by *ngFor with data from an array
> that is filtered and ordered by two pipes. How can I use the arrow keys to
> scroll through the table rows? It should highlight the current selected row
> and the object from the array should be available for further processing.
>
> Thanks for your input :)
>
Hello Team,
I wanted to implement arrowup and down in list. below is my html tag,
anyone help me to implement arrowup and down in angular6
<ul class="filter-select" >
<li *ngFor="let result of suggestions trackBy: trackByName let i = index"
[class.active]="i == arrowkeyLocation" (click)=
"onQuerySuggestionSelect(result)" class="filter-select__item">
{{result.itemName}}
</li>
</ul>
import { Component, EventEmitter, Output, Input, HostListener, OnChanges }
from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { AppConfig } from '../../app.config';
import { SuggestBoxService } from '../suggestbox/suggestbox.service';
import { SuggestionService } from '../suggestbox/suggestionsearch.service';
import { QuerySuggestionItem } from '../suggestionmodels/suggestionItems';
@Component({
selector: 'app-querysuggestion',
templateUrl: './querysuggestion.component.html',
styleUrls: ['./querysuggestion.component.css'],
providers: [SuggestBoxService, SuggestionService]
})
export class QuerysuggestionComponent {
protected configSettings = AppConfig.settings;
@Input() suggestions: QuerySuggestionItem[];
@Output() queryRequestparam = new EventEmitter<any>();
q = '';
constructor(
public router: Router,
private activeRoute: ActivatedRoute,
private suggestBoxService: SuggestBoxService
) {
}
onQuerySubmit() {
this.suggestBoxService.generateSuggestionQueryParams('q', this.q);
}
trackByName(index: number, item: QuerySuggestionItem) {
return item.itemName;
}
@HostListener('document : click')
clickOutside() {
this.dropdownDestroy();
}
dropdownDestroy() {
this.suggestions = [];
}
onQuerySuggestionSelect(item) {
this.dropdownDestroy()
this.queryRequestparam.emit(item);
}
}
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
