MDT5_Angular/src/app/components/blog-create/blog-create.component.html

<app-blog-entry *ngFor="let entry of entries" [entry]="entry"></app-blog-entry>
<h2>Neuen Einkaufszettel Eintrag anlegen:</h2>
<div>
  <form (ngSubmit)="saveTask(form.value)" #form="ngForm">
    <div class="form-group">
      <div><label>Position </label></div>
      <div>
        <input type="text" class="form-control" name="title" id="position" #position ngModel required/>
      </div>
    </div>
      <div class="form-group">
        <div><label>Einkaufsort* </label></div>
        <div>
          <input type="text" class="form-control" name="title" id="title" #einkaufsort ngModel required/>
        </div>

      </div>
      <div class="form-group">
        <div><label for="kategorie">Kategorie </label></div>
        <div>
          <input type="text" class="form-control" name="title" id="kategorie" #kategorie ngModel required/>
        </div>
      </div>
      <div class="form-group">
        <div><label for="menge">Menge* </label></div>
        <div>
          <input type="text" class="form-control" name="title" id="menge" #menge ngModel required/>
        </div>
      </div>

      <div class="form-group">
        <div><label for="kommentar">Kommentar: </label></div>
        <textarea id="kommentar" #kommentar cols="20" rows="3" #text>
    </textarea>
      </div>

      <div class="form-group">
        <button
          (click)="createBlogEntry(einkaufsort.value, kategorie.value, menge.value, kommentar.value, position.value)">
          Eintrag anlegen
        </button>
      </div>

      <div class="form-group">
        <div>
          <button (click)="deleteAllEntries()">
            Alle Einträge löschen
          </button>
        </div>
        <div>
          <button (click)="deleteLastEntry()">
            Letzten Eintrag Löschen
          </button>
        </div>
      </div>
      <div class="form-group">
        <div><label for="menge">Eintrag auswählen: </label></div>
        <div>
          <input type="text" class="form-control" name="title" id="index" #index ng-model required min="0" max=99/>
        </div>
      </div>

      <div>
        <div>
          <button (click)="deleteEntry(index.value)">
            Eintrag löschen
          </button>
        </div>
      </div>

  </form>
</div>