Readdy Write

Angular: Daten verwalten

05.01.2021 (๐Ÿ‘2832)


 

Wo definiert man die Daten und wie zeigt man die Daten an

 

Die Daten werden in der app.component.ts definiert

Beispiel: mehrere Aufgaben in einer Tabelle oder Array wie Datenmenge  =[โ€˜aโ€˜,โ€˜bโ€˜,โ€˜cโ€˜]

 

aufgaben=['Aufgabe1','Aufgabe2','Aufgabe3'];

 

Und zeigt diese in der app.compontent.html

 <li *ngFor="let aufgabe of aufgaben">{{aufgabe}}</li>

 

 

Definieren in der .ts

 

Anzeigen in der .html

Und in der Ausgabe app.component.html

 

 

Erzeugt als Ausgabe in html

dailycheck

  • Aufgabe1
  • Aufgabe2
  • Aufgabe3

 

 

 

 

 

Daten definieren in app.compontent.ts

Definitions Code in app.component.ts

import { Component } from '@angular/core';

import { AngularFireModule  } from 'angularfire2';

@Component({

  selector: 'app-root',

  templateUrl: './app.component.html',

  styleUrls: ['./app.component.css']

})

export class AppComponent {

  //--< Daten >--

  title = 'dailycheck';

  aufgaben=['Aufgabe1','Aufgabe2','Aufgabe3'];

  //--</ Daten >--

  constructor(af:AngularFireModule) {

    console.log(af);

    

  }

}

 

 

 

Datenb Anzeigen in app.compontent.html

Ausgabe Code in der .html

<h1>{{title}}</h1>

<ul>

  <li *ngFor="let aufgabe of aufgaben">{{aufgabe}}</li>

</ul>

 

 


0,00 €