ionic2
Konstruktor i OnInit
Szukaj…
Wprowadzenie
W odniesieniu do ionic2 constructor : w prostych słowach używamy go do tworzenia instancji naszych wtyczek, usług itp. Na przykład: Masz stronę (widok), na której chcesz wyświetlić listę wszystkich studentów, i masz plik json który zawiera wszystkich uczniów (ten plik jest plikiem danych), co musisz zrobić, aby utworzyć usługę w tej usłudze, utworzysz metodę i trafisz na żądanie http.get, aby uzyskać dane JSON, więc tutaj potrzebujesz czego? http po prostu zrób tak:
Przykład metody usługi ucznia dla użycia HTTP w konstruktorze
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)
}
}
zauważmy teraz konstruktora, jeśli chcemy skorzystać z tej metody usługi, przejdziemy do naszego widoku / strony i:
import {StudentService} from './student.service';
import { SocialSharing } from '@ionic-native/social-sharing';
export class HomePage implements OnInit {
constructor(public _studentService: StudentService, public socialSharing: SocialSharing) {
}
jeszcze raz zauważmy tutaj konstruktora, tworzymy wystąpienie StudentService w konstruktorze i jeszcze jedno, używamy wtyczki socialSharing, aby użyć tego, że tworzymy również wystąpienie tego w konstruktorze.
Metoda ngOnInit, aby uzyskać listę studentów przy ładowaniu widoku
OnInit : jest to naprawdę niesamowita rzecz w ionic2 lub możemy powiedzieć w AngularJs2. W tym samym powyższym przykładzie możemy zobaczyć, czym jest ngOnInit. Tak więc jesteś gotowy na metodę obsługi, teraz w widoku / stronie chcesz, aby dane listy studentów były dostępne, gdy tylko pojawi się twój widok, powinna to być pierwsza operacja wykonywana automatycznie po załadowaniu, ponieważ gdy widok ładuje ucznia lista powinna być widoczna. Tak więc klasa implementuje OnInit, a ty definiujesz ngOnInit. Przykład:
Przykład ngOnInit, aby uzyskać listę studentów na stronie / widoku
export class HomePage implements OnInit {
...
....
constructor(....){}
ngOnInit(){
this._studentService.getAllStudents().subscribe(
(students: Students[]) => this.students = students,
)