使用 ion-label 时出现离子错误 - TypeError: Cannot read property 'children' of null

Posted 2023-03-13

【中文标题】使用 ion-label 时出现离子错误 - TypeError: Cannot read property \'children\' of null

【英文标题】：Ionic error when using ion-label - TypeError: Cannot read property 'children' of null使用 ion-label 时出现离子错误 - TypeError: Cannot read property 'children' of null

【发布时间】：2018-04-01 22:41:51

【问题描述】：

我的应用程序出现错误。当我将ion-item 与ion-label + ion-input / ion-chkbox 一起使用时，我收到此错误：

TypeError: Cannot read property 'children' of null

当我删除 ion-label 工作正常！

错误示例：

<ion-item no-lines>
    <ion-label floating>TEXT HERE</ion-label>
    <ion-checkbox [(ngModel)]="pageDocument.accept"></ion-checkbox>
</ion-item>

工作示例：

<ion-item no-lines>
    <ion-checkbox [(ngModel)]="pageDocument.accept"></ion-checkbox>
</ion-item>

代码有什么问题？提前致谢！

【参考方案1】：

pageDocument 可能在运行开始时设置为 null？尝试使用单独的变量：

<ion-item no-lines>
    <ion-label floating>TEXT HERE</ion-label>
    <ion-checkbox [(ngModel)]="accept"></ion-checkbox>
</ion-item>

【讨论】：

没用！ :( 甚至在构造函数中声明 accept = true ...... :(

会不会和ion-split-pane有关？我试图删除 de ion-split-pane（它被放置在页面内）并且它有效！

【参考方案2】：

你可以试试如下图：

工作Stackblitz

<ion-content padding>
    <ion-list>
        <ion-item no-lines>
            <ion-label fixed>TEXT HERE</ion-label>
            <ion-checkbox [(ngModel)]="pageDocument?.accept" item-end></ion-checkbox>
        </ion-item>
    </ion-list>
</ion-content>

【讨论】：

没有工作:(

你看到上面的stackblitz了吗？它工作得很好。

会不会和ion-split-pane有关？我试图删除 de ion-split-pane（它位于页面内）并且它有效！

你没有在你的问题上告诉任何关于ion-split 的信息。你能用stackblitz模拟你的问题吗？ :stackblitz.com

很抱歉错过了这些信息！但 Ia 将 ion-split-pane 移至 app.html 文件，一切正常！