删除*ngIf断点，硬编码"true“有效
删除*ngIf断点，硬编码"true“有效
提问于 2018-06-01 04:19:08
我这里有一些相当简单的代码：
<abc-richtexteditor
matInput
placeholder="Content"
id="{{ (subsection.id) + '-editor' }}"
required
[canEdit]="canEditFeature"
[initialValue]="subsection.content">
</abc-richtexteditor>上面的代码破坏了组件<abc-richtexteditor>中的代码，但是如果我只是在*ngIf中硬编码true，那么它工作得很好。
<abc-richtexteditor
*ngIf="true"
matInput
placeholder="Content"
id="{{ (subsection.id) + '-editor' }}"
required
[canEdit]="canEditFeature"
[initialValue]="subsection.content">
</abc-richtexteditor>错误：
ERROR TypeError: Cannot read property 'getContent' of undefined
at RichtexteditorComponent.get相关内容：
get value (): string {
return this.editor.getContent();
}相关内容：
<editor
test="test"
name="editor"
apiKey="test"
[initialValue]="initialValue"
[init]="config">
</editor>相关内容：
get config() {
return {
...
setup: (editor) => {
this.editor = editor;
}
...
}
}有什么想法吗？
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-06-01 06:03:57
我将尝试描述angular组件的生命周期(OnInit，AfterViewInit)。假设您有三个组件。A、B、C
在A组件模板中，您具有以下内容：
<B [someInput]="valueFromAComponent"></B>
在您的B组件模板中：
<C [someInput]="valueFromBComponent"></C>
您的组件周期如下：
constructor.
- Component constructor.
- Component constructor.
- Component ngOnInit.
- Component ngOnInit.
- Component ngOnInit.
- Component ngAfterViewInit.
- Component D27 ngAfterViewInit.
- Component D30 ngAfterViewInit.
-
AngOnInit. - Component ngOnInit.
- Component
ABCCCABCC
在ngOnInit上，所有输入值都将根据您在子组件中使用ngIf传递，直到父组件设置输入值。
如果您放入任何未初始化的值，角度变化检测将在您的C组件中运行，并抛出一个类似cannot read property x of undefined的异常。
因此，如果您的子组件依赖于父组件的某些输入，则应该使用ngIf，直到该值具有正确的值。
我希望这将帮助您解决您的问题:)。
Stack Overflow用户
发布于 2018-06-01 05:03:59
之所以使用ngif，是因为直到所有内容都是init并且值为true，angular才会使用ngif创建视图。
因此，当您的html呈现时，您的内容值看起来是未定义的。
你可以发布代码吗?你是如何设置subsection.value的？
只需将您的配置()代码移动到组件类中的onInit()即可
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50632176
复制相关文章
相似问题