add: export to json file

diff --git a/src/app/app.component.html b/src/app/app.component.html
index 4bff8ff3b267a1f68acb5288bd2f4ecc913a118e..404ceabc266e085c9143712aee724accea76790e 100644 (file)
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,3 +1,14 @@
+<button class="button"
+       type="button"
+       id="exportJson"
+       (click)="exportJson()">Export</button>
+<button class="button"
+       type="button"
+       [disabled]="downloadJsonHref === ''"
+       id="downloadJson">
+       <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 bd5626c23b8561cb42e4e9e4f9a44ca5c15a6b22..5bfb5451d37a0881856583be661615fbf57df441 100644 (file)
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -3,6 +3,7 @@ import { ITitle } from './ititle';
 import { ISubtitle } from './isubtitle';
 import { IFood } from './ifood';
 import { IFoodCard } from './ifood-card';
+import { DomSanitizer, SafeUrl } from '@angular/platform-browser';
 
 @Component({
        selector: 'app-root',
@@ -20,6 +21,9 @@ export class AppComponent
        public formSubtitleVisible: boolean = false;
        public formFoodVisible: boolean = false;
        public edit: boolean = false;
+       public downloadJsonHref: SafeUrl = "";
+
+       constructor(private sanitizer: DomSanitizer) {}
 
        public changeFormTitleVisible(): void
        {
@@ -56,6 +60,14 @@ export class AppComponent
                return false;
        }
 
+       public exportJson(): void
+       {
+               let json = JSON.stringify(this.foodcard);
+               let uri = this.sanitizer.bypassSecurityTrustUrl(
+                       "data:text/json;charset=UTF-8," + json);
+               this.downloadJsonHref = uri;
+       }
+
        public addTitle(): void
        {
                this.foodcard.Titles.push(this.title);