1

我有一个页面组件，它有一个FormBuilder表单：

public adForm: FormGroup = this.fb.group({
  questions: this.fb.array([])
});

我传递questions给一个<questions>组件：

<questions [questions]="adForm.get('questions')"></questions>

其中有一个@Input() questions: FormArray;并使用这个模板：

<StackLayout orientation="vertical">
  <!-- If I comment out listview then it doesn't throw the error -->
  <ListView [items]="questions">
    <ng-template let-question="item">
      <Label [text]="question.model"></Label>
    </ng-template>
  </ListView>
  <Button class="btn btn-md btn-primary" text="Add question" (tap)="addQuestion()"></Button>
</StackLayout>

我面临的问题是该ListView位引发此错误：

TypeError: Cannot read property 'Symbol' of undefined

如果我将该部分注释掉，那么它不会引发错误。

我知道它与questions表单数组有关，但我无法弄清楚是什么。undefined它已定义，因此与获取而不是空数组有关的问题应该不是问题。

请注意，此错误是直接在组件初始化时引发的。我已经登录questions了ngOnInit，它不是未定义的。

我究竟做错了什么？

4

2 回答 2

2

只是为了在样板中添加一些东西，我也遇到了这个问题，而且列表更简单，尽管我使用的组件是 Telerik 的 RadListView，它仍然基于 nativescript 的核心 ListView。

相关的 HTML 是：

   <GridLayout tkExampleTitle tkToggleNavButton>
        <RadListView class="list-group" ng-if="!isLoading" [items]="getAsyncList">
            <ng-template tkListItemTemplate let-item="item">
                <StackLayout class="list-group-item" orientation="vertical">
                    <Label class="list-group-item-heading" [text]="item.name"></Label>
                </StackLayout>
            </ng-template>
        </RadListView>
    </GridLayout>

我也遇到了这个错误，虽然从控制台检测到这个问题并不容易：

JS: ERROR TypeError: Cannot read property 'Symbol' of undefined
JS: ERROR CONTEXT [object Object]

因此，在像疯子一样跑了大约 30 分钟后，我发现问题比我预期的要容易得多。

参数应该是 getter的items结果，但我确实在我的组件中定义了一个同名的函数：

public getAsyncList() {
  return this.ListViewCollection;
}

所以它可能将函数引用到列表而不是 getter，因此我不得不将其更改为：

public get getAsyncList() {
  return this.ListViewCollection;
}

（注意get）。

有点难以追查问题，但是嘿，无论如何这是我的错：P。

于 2017-11-08T15:48:19.463 回答
1

我完全忘记了，如果我传递一个表单数组，我实际上并没有得到数组的原始值。所以在 ListView 中我要么必须做，questions.value要么questions.controls是为了循环它们。

我希望这对将来的其他人有所帮助。

于 2017-04-21T19:18:51.827 回答