ionic2
Konstruktör och OnInit
Sök…
Introduktion
När det gäller ionic2 constructor : i enkla termer använder vi den för att skapa instanser av våra plugins, tjänster etc. till exempel: Du har en sida (vy) där du vill visa listan över alla studenter, och du har en json-fil som innehåller alla studenter (den här filen är din datafil) vad du måste göra är att skapa en tjänst i den här tjänsten kommer du att skapa en metod och slå en http.get-begäran för att få json-data, så här behöver du vad? http gör helt enkelt så här:
Exempel på studenttjänstmetod för användning av Http i konstruktör
import {Http} from '@angular/http';
@Injectable()
export class StudentService{
constructor(public http: Http){}
getAllStudents(): Observable<Students[]>{
return this.http.get('assets/students.json')
.map(res => res.json().data)
}
}
Lägg märke till konstruktören nu igen om vi vill använda den här servicemetoden går vi till vår vy / sida och:
import {StudentService} from './student.service';
import { SocialSharing } from '@ionic-native/social-sharing';
export class HomePage implements OnInit {
constructor(public _studentService: StudentService, public socialSharing: SocialSharing) {
}
igen märker konstruktören här, vi skapar en instans av StudentService i konstruktör och en sak till, vi använder socialSharing-plugin så att vi skapar exempel på det i konstruktör också.
ngOnInit-metod för att få en lista över elever som är på belastning
OnInit : det här är verkligen fantastiskt i ionic2 eller vi kan säga i AngularJs2. Med samma exempel ovan kan vi se vad som är ngOnInit. Så du är redo med servicemetoden, nu i din vy / sida vill du att studentlistadata är tillgängliga så snart din vy kommer att visas, detta bör vara den första åtgärden som sker automatiskt vid belastning, eftersom när vyn laddas eleven listan ska vara synlig. Så klassen implementerar OnInit och du definierar ngOnInit. Exempel:
ngOnInit exempel för att få en lista över elever på sidan / visa
export class HomePage implements OnInit {
...
....
constructor(....){}
ngOnInit(){
this._studentService.getAllStudents().subscribe(
(students: Students[]) => this.students = students,
)