ngOnInit和Constructor被调用两次

时间:2017-07-11 16:25:11

标签: angularjs ionic-framework ionic3

出于某种原因,我正在调用两次函数,我似乎无法弄明白为什么。

我在这里看到这个问题

why ngOnInit called twice?

哪个引用了这个github问题

https://github.com/angular/angular/issues/6782

但这似乎表明我在多个地方导入文件,我认为不是这样。

据我所知,我正在利用Ionic 3的延迟加载。

这是一个链接到一个剥离的github仓库,你可以在本地运行以查看问题(对不起,我无法找到让它在plunker或codepen中运行的最佳方法)

https://github.com/Jordan4jc/ionic-init-example

这个概念让主应用程序首先从商店中加载一个令牌,然后验证它,以及它是否仍然是EventsPage的有效路由,但如果不是,它将路由到LoginPage

在这个示例中,我假装它并假装令牌有效并且路由到EventsPage,正如您将在ngOnInit函数中看到的(如果我将其移入构造函数,则会发生事件{ {1}} console.log`被调用两次。这将命中我的服务器以获取最新数据,所以我真的不想两次点击我的API。

编辑:这是the

中的内容
app.component.ts

1 个答案:

答案 0 :(得分:3)

我相信我找到了答案。

我在堆栈溢出时发现了这个问题

why ngOnInit called twice?

一个答案引用了模板编译错误,并且滚动浏览剩余的答案还引用了一个事实,即如果模板中没有明确的type="button"按钮,则浏览器可能会将其视为提交按钮因此导致应用程序多次执行代码。将此属性添加到我在我的应用程序中找到的没有它的按钮似乎已经解决了问题。