1 | import { Component, Injectable, OnInit } from '@angular/core';
|
---|
2 | import { FormControl } from '@angular/forms';
|
---|
3 | import {map, startWith, switchMap} from 'rxjs/operators';
|
---|
4 | import {forkJoin, Observable} from 'rxjs';
|
---|
5 | import { CityService } from '../_services/city.service';
|
---|
6 | import { City } from '../_models/city';
|
---|
7 | import { Country } from '../_models/country';
|
---|
8 | import { CountryService } from '../_services/country.service';
|
---|
9 | import { Companion } from '../_models/companion';
|
---|
10 | import { CompanionService } from '../_services/companion.service';
|
---|
11 | import { Category } from '../_models/category';
|
---|
12 | import { CategoryService } from '../_services/cateogry.service';
|
---|
13 | import {CdkDragDrop, moveItemInArray} from '@angular/cdk/drag-drop';
|
---|
14 | import { MatChip } from '@angular/material/chips';
|
---|
15 |
|
---|
16 | @Component({
|
---|
17 | selector: 'app-locations-form',
|
---|
18 | templateUrl: './locations-form.component.html',
|
---|
19 | styleUrls: ['./locations-form.component.css']
|
---|
20 | })
|
---|
21 | export class LocationsFormComponent implements OnInit {
|
---|
22 |
|
---|
23 | myControl = new FormControl();
|
---|
24 | cities: City[];
|
---|
25 | countries: Country[];
|
---|
26 | companions: Companion[];
|
---|
27 | categories: Category[];
|
---|
28 | filteredOptions: Observable<City[]>;
|
---|
29 | disableSelect = new FormControl(false);
|
---|
30 |
|
---|
31 | constructor(private cityService : CityService, private countryService : CountryService,
|
---|
32 | private companionService : CompanionService, private categoryService : CategoryService){
|
---|
33 | this.filteredOptions = new Observable<City[]>();
|
---|
34 | this.cities = [];
|
---|
35 | this.countries = [];
|
---|
36 | this.companions = [];
|
---|
37 | this.categories = [];
|
---|
38 | }
|
---|
39 |
|
---|
40 | ngOnInit() :void {
|
---|
41 | this.filteredOptions = this.myControl.valueChanges
|
---|
42 | .pipe(
|
---|
43 | startWith(''),
|
---|
44 | switchMap(val => {
|
---|
45 | return this.filter(val || '')
|
---|
46 | })
|
---|
47 | );
|
---|
48 |
|
---|
49 | this.categoryService.getAllCategories().subscribe(
|
---|
50 | data => {
|
---|
51 | this.categories = data;
|
---|
52 | }
|
---|
53 | );
|
---|
54 |
|
---|
55 | this.companionService.getAllCompanions().subscribe(
|
---|
56 | data => {
|
---|
57 | this.companions = data;
|
---|
58 | }
|
---|
59 | )
|
---|
60 | }
|
---|
61 |
|
---|
62 | filter(val: string): Observable<City[]> {
|
---|
63 | // call the service which makes the http-request
|
---|
64 | return this.cityService.getAllCities()
|
---|
65 | .pipe(
|
---|
66 | map(response => response.filter(option => {
|
---|
67 | return option.name.toLowerCase().indexOf(val.toLowerCase()) === 0
|
---|
68 | }))
|
---|
69 | )
|
---|
70 |
|
---|
71 | }
|
---|
72 |
|
---|
73 | toggleSelection(chip: MatChip){
|
---|
74 | chip.toggleSelected();
|
---|
75 | }
|
---|
76 |
|
---|
77 | }
|
---|