问题标签 [ngoninit]

我在使用 Angular 材料表（Angular 材料表）时遇到问题

我跑来ng generate @angular/material:material-table --name=car-table生成默认的角度表，它工作正常。但是，如果我尝试将数据（汽车）注入它，CarsTableDataSource它就会停止工作。它必须与异步函数和ngOnInit生命周期挂钩相关。

您可以在StackBlitz中查看代码。关键部分在src/app/cars/文件夹中。

汽车.component.ts

汽车表datasource.ts

汽车.component.html

问题在于ngOnInit和

作为我得到的错误ERROR TypeError: Cannot read property 'cars' of undefined，这意味着dataSource在解析模板时未定义，但函数ngOnInit：

打印出来：

该页面仍会加载所有内容，但我不能例如通过该方法添加汽车，因为它们确实会添加到数据库中，但不会在视图中更新，尽管this.table.renderRows()如文档中所述调用：

由于该表针对性能进行了优化，因此它不会自动检查数据数组的更改。相反，当在数据数组上添加、删除或移动对象时，您可以通过调用其renderRows()方法来触发对表的呈现行的更新。

我尝试ngOnInit使用Observables 而不是 s async/await，但它也不起作用：

如果我不做任何数据库获取 中的东西ngOnInit，那么就没有任何错误。

add()如前所述，我现在也无法添加任何汽车。

如果您需要任何其他信息 - 请随时问我，我会尽快回复。

编辑

如果我将代码编辑为如下所示：

错误的顺序更改为：

这意味着错误发生在

我已经尝试过使用 a.subscribe()并在该块中执行所有操作，但那里没有运气。

编辑 2

如here（stackoverflow）所述，您必须dataSource使用空白对象初始化，因为在所有微任务完成之前解析视图ngOnInit。在视图初始化之后初始化分页器。

现在它可以工作了，但这有点像黑客。我不知道为什么，但是每当 Angular 的生命周期钩子中的异步代码在哪里时，钩子都会在异步代码完成之前完成。我不知道为什么。在它看到await它之后立即退出该函数，并且只有在那之后才被dataSource初始化。我真的很感激解释。

编辑 3

另一种解决方法是在视图中添加空条件运算符，如下所示：

有了这条线：

由于视图是在 ngOnInit 完成一半时执行的，因此您必须在使用该属性的任何地方添加它，以便在解析视图时它不会进入最终的 html。

编辑 4

我更新了 Stackblitz 应用程序的链接，现在它尽可能简约地代表问题。

我创建了一个带有两个文本字段的 ng-template。我试图在我的屏幕加载时打开这个模板弹出窗口。但是当我通过我的身份证时它不起作用。

我尝试通过其他按钮单击传递值，但它不起作用。如何在页面加载时传递 ng 模板 ID

我正在努力处理 Angular 6 的异步问题。这是一个例子。我只想进入'if'并显示控制台日志，但它从未发生过。getListOne 和 getListTwo 调用 Observable API 并在我的 html 上很好地显示。

我不明白为什么我的对象在角度上的 ngoninit 上总是“未定义”。我在我的 api 项目上请求我得到正确的响应。当我console.log没有定义我的对象（ngoninit）但在其他函数中我可以获得值时。

我的问题是为什么以及如何在 ngoninit 中获取我的对象。

谢谢

我在邮递员上正确检索我的回复，其他功能也检索

服务：

查看型号：

零件：

邮差：

我有一个 Angular 7 项目并导入了 Gsap 库。我希望每次导航到页面时都播放动画，因此我在 ngOnInit 中实现了 gsap 动画，但动画仅在我第一次访问页面时播放，并且在下次访问时没有动画。我创建了一个回调来在动画完成时记录一条消息，每次我导航到页面时，我都可以看到控制台中记录了完整的消息，但没有动画。这是我的 ts 代码：

感谢帮助！

我有两个名为 AddPersons 和 PersonList 的组件。在 AddPerson 组件中添加一个人后，我正在尝试刷新 PersonList 组件。为此，我尝试从 AddPerson 调用 PersonList 组件的 ngOnInit()。

我在 PersonList 中获取更新的数据，但列表没有在 html 中更新。

add-person-component.ts：

人员列表组件.ts：

我有一个模态组件，它从外部获取输入，并且在打开时会向服务器发送请求以获取数据。获取数据后，它被分配给一个公共变量并用于显示数据。我如何为它写一个测试？我需要模拟HttpClient吗？还是我必须提供所有@Input元素，然后照常发出请求？但在这种情况下，我需要有真实数据供后端在数据库中查找。

我尝试用谷歌搜索这个特定问题，但似乎找不到任何东西。我确实找到了如何模拟请求，但不是当它们在ngOnInit()内部时。我将在下面添加所有必要的代码。

零件：

服务：

测试自己：

我是新来的，所以请耐心等待。我遇到了 Angular 重定向问题。当我手动清除存储时，代码执行 ngOnInit，提示错误，重定向到登录页面（如预期的那样），但是当我尝试使用注销方法做同样的事情时，我的代码执行注销方法，ngOnInit 然后重定向到登录页面。为什么当我重定向到另一个页面时它正在执行同一页面的 ngOnInit ？下面的代码显示了注销方法。

我尝试在全球范围内制作，将代码移动到构造函数

代码应该只执行 logout 方法而不是同时执行 logout 和 ngOnInit

我想通过输入来检索模型车的值，但我不确定它是如何工作的。这是我尝试过的。

不幸的是，模型总是空的。我该怎么办？

编辑：父 HTML

父 ts 文件

我有一个产品数组，其字段名称为 ID、品牌、价格、数量销售、价值，其中价值 = 价格 * 数量出售，最后我需要显示商品数量、销售总量和总销售价值

需要显示产品数量、销售数量和销售价值总和