change: file input per event

diff --git a/src/app/app.component.html b/src/app/app.component.html
index 404ceabc266e085c9143712aee724accea76790e..d9cf52b56060000b6478a9a7022de536d9a57cd2 100644 (file)
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,3 +1,7 @@
+<input type="file"
+       name="fileupload"
+       (change)="fileEvent($event)" />
+
 <button class="button"
        type="button"
        id="exportJson"
@@ -9,6 +13,7 @@
        <a [href]="downloadJsonHref"
        [hidden]="downloadJsonHref === ''"
        download="speisekarte.json">Download</a></button>
+
 <button class="button main"
        type="button"
        id="buttonTitle"

diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 5bfb5451d37a0881856583be661615fbf57df441..72e3e6a9e00ae22cf56dc507db8d5b453297779d 100644 (file)
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -4,6 +4,7 @@ import { ISubtitle } from './isubtitle';
 import { IFood } from './ifood';
 import { IFoodCard } from './ifood-card';
 import { DomSanitizer, SafeUrl } from '@angular/platform-browser';
+import { ImportService } from './import.service';
 
 @Component({
        selector: 'app-root',
@@ -23,7 +24,10 @@ export class AppComponent
        public edit: boolean = false;
        public downloadJsonHref: SafeUrl = "";
 
-       constructor(private sanitizer: DomSanitizer) {}
+       constructor(private sanitizer: DomSanitizer,
+               private importService: ImportService)
+       {
+       }
 
        public changeFormTitleVisible(): void
        {
@@ -68,6 +72,11 @@ export class AppComponent
                this.downloadJsonHref = uri;
        }
 
+       public fileEvent(fileInput: Event): void
+       {
+               console.log(fileInput);
+       }
+
        public addTitle(): void
        {
                this.foodcard.Titles.push(this.title);

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 1172a6e8177d60a9cc4a3fc0d2b10c3b9ede2d46..054ef9d6a554cada5ab90cbe7d190254fe8a6bcf 100644 (file)
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -1,6 +1,7 @@
 import { NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { FormsModule } from '@angular/forms';
+import { HttpClientModule } from '@angular/common/http';
 
 import { AppComponent } from './app.component';
 
@@ -10,7 +11,8 @@ import { AppComponent } from './app.component';
   ],
   imports: [
     BrowserModule,
-    FormsModule
+    FormsModule,
+    HttpClientModule
   ],
   providers: [],
   bootstrap: [AppComponent]

diff --git a/src/app/import.service.spec.ts b/src/app/import.service.spec.ts
new file mode 100644 (file)
index 0000000..da66864
--- /dev/null
+++ b/src/app/import.service.spec.ts
@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { ImportService } from './import.service';
+
+describe('ImportService', () => {
+  let service: ImportService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(ImportService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

diff --git a/src/app/import.service.ts b/src/app/import.service.ts
new file mode 100644 (file)
index 0000000..b0f2842
--- /dev/null
+++ b/src/app/import.service.ts
@@ -0,0 +1,18 @@
+import { Injectable } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { IFoodCard } from './ifood-card';
+import { Observable } from 'rxjs';
+
+@Injectable({
+       providedIn: 'root'
+})
+
+export class ImportService
+{
+       constructor(private httpClient: HttpClient) {}
+
+       public getImport(path: string): Observable<IFoodCard>
+       {
+               return this.httpClient.get<IFoodCard>(path);
+       }
+}