компоненты компонентов в nativescript, не заполняющие ответ от django api - PullRequest
0 голосов
/ 14 января 2019

У меня есть простой django api, который предоставляет список названий фильмов с их идентификаторами.

Я создал службу фильмов в скрипте типа, который выполняет операцию get и получает список названий и идентификаторов фильмов.

В нативном скрипте у меня есть два файла items.component.ts

import { Component, OnInit } from "@angular/core";
import { MovieService } from "../services/movie.service";

@Component({
    selector: "ns-items",
    moduleId: module.id,
    templateUrl: "./items.component.html",
    providers: [MovieService]
})
export class ItemsComponent implements OnInit {
    items;

    constructor(private movieService: MovieService) { }

    ngOnInit(): void {
        this.movieService.getMovies().subscribe(
            movies => {
                this.items = movies;
                console.log(movies);
            },
            error => {
                console.log('error', error);
            }
        );
    }

}

и items.component.html

<ActionBar title="Movie Rater App" class="action-bar">
</ActionBar>
<StackLayout class="page">

    <ListView [items]="items" class="list-group">
        <ng-template let-item="item">
            <Label [nsRouterLink]="['/item', item.id]" [text]="item.title"
                class="list-group-item"></Label>
        </ng-template>
    </ListView>

</StackLayout>

Я вижу пустой экран приложения в эмуляторе - только заголовок панели действий. Нет исключений в логах

Я проверил, что API работает нормально, и даже я вижу ответ в консоли (то есть вывод console.log (movies)).

Любая помощь будет оценена.

Ответ API django:

{
    "count": 5,
    "next": null,
    "previous": null,
    "results": [
        {
            "id": 1,
            "title": "Rocky (1976)",
            "description": "A small-time boxer gets a supremely rare chance to fight a heavy-weight champion in a bout in which he strives to go the distance for his self-respect.",
            "moviePoster": "http://127.0.0.1:8000/pic_folder/rocky-1976-poster2451370.jpg",
            "avg_rating": 5,
            "no_of_ratings": 1,
            "maxRatings": 5
        },
        {
            "id": 16,
            "title": "Rocky II",
            "description": "Rocky II",
            "moviePoster": "http://127.0.0.1:8000/pic_folder/rocky2.jpg",
            "avg_rating": 5,
            "no_of_ratings": 1,
            "maxRatings": 5
        }
}

1 Ответ

0 голосов
/ 14 января 2019

Вы должны присвоить результирующий массив items, поэтому он должен быть,

this.movieService.getMovies().subscribe(
        movies => {
            this.items = movies.results;
            console.log(movies);
        },
        error => {
            console.log('error', error);
        }
    );

Также вам может не понадобиться StackLayout, обертывающий ListView, вы можете удалить его.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...