Почему представление списка в Nativescript с Typescript приводит к ошибке self.parent.parent, а не к объекту?

Обновление: проблема заключалась в недостаточном понимании синтаксиса. И следующий вопрос был написан с общим синтаксисом, приводящим к примеру, который не создает ошибку. Смотрите ответ для объяснения.

Подобно этому вопросу, но я следую ответу, который дан, и имею новую проблему.

вызвано: undefined не является объектом (оценивается как "self.parent.parent.context.item.name")

почему он ссылается на self.parent.parent? а не parent.child? в этом моя проблема?

app.component.html

<TabView #tabview [selectedIndex]="tabindex" class="">

        <DockLayout *tabItem="{title: 'Tab1'}">
            <StackLayout dock='left'>
                <ListView [items]="items">
                    <template let-item="item">
                            <StackLayout>
                                <Label [text]='item.name' textWrap="true"> </Label>
                            </StackLayout>
                    </template>
                </ListView>
             </StackLayout>
        </DockLayout>


    </TabView>

app.component.ts

import { Component, OnInit } from "@angular/core";
import { Page } from "ui/page"
import { ListView } from "ui/list-view"
import { Item } from "../item";
import { ItemService } from "../../services/item.service";
import dockModule = require("ui/layouts/dock-layout");




@Component({
  selector: "my-app",
  templateUrl: "./app.component.html",
  providers: [ItemService]
})
export class AppComponent implements OnInit{ 

  public items: Item[];

  constructor(private itemService: ItemService) { 

  };



  getItems(): void {
    this.itemService.getItems().then(items => this.items = items);
  }
  ngOnInit(): void {
    this.getItems();
  }


}

item.ts

export class Item {
  id: number;
  name: string;
}

item.service.ts

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

import { Item } from '../item';
import { ITEMS } from '../database/mock-items';

@Injectable()

export class ItemService {
    getItems(): Promise<Item[]> {
    return Promise.resolve(ITEMS);
  }
}

1 ответ

Решение

Для тех, кто сталкивается с этой или аналогичной проблемой.

В конце концов, может быть, это интуитивно понятно для всех остальных, но я подумал, что это было простым совпадением, что все использовали <template let-item="item"> как их код. По правде говоря, приведенный выше код будет работать, потому что тег шаблона написан правильно. Но проблема, с которой я столкнулся, заключалась в том, что я попытался написать синтаксис с другим ключевым словом. <template let-item="account">, По сравнению с использованием *ngFor "let account of accounts" Это даст

не объект

ошибка, как я упоминал выше. При составлении вопроса я редактировал неосознанно, чтобы отразить правильный синтаксис.

Другие вопросы по тегам