从 Ionic2 中的 resume() 启动先前的状态

Question

我的 ionic2 应用程序出现问题。情况是当应用程序进入后台时，我将最后一个状态保存在本地存储中，当应用程序恢复时，它会检查本地存储中 lastState 的值。如果它有一个值，则该状态被推送。我得到的错误是

ERROR Error: Uncaught (in promise): invalid link: <StateName>
at c (file:///android_asset/www/build/polyfills.js:3:13190)
at Object.reject (file:///android_asset/www/build/polyfills.js:3:12546)
at NavControllerBase._fireError (file:///android_asset/www/build/main.js:44942:16)
at NavControllerBase._failed (file:///android_asset/www/build/main.js:44930:14)
at file:///android_asset/www/build/main.js:44985:59
at t.invoke (file:///android_asset/www/build/polyfills.js:3:8971)
at Object.onInvoke (file:///android_asset/www/build/main.js:4407:37)
at t.invoke (file:///android_asset/www/build/polyfills.js:3:8911)
at r.run (file:///android_asset/www/build/polyfills.js:3:4140)
at file:///android_asset/www/build/polyfills.js:3:13731

但应用程序运行良好。谁能告诉我这种行为的原因？

代码app.component.ts

     this.platform.pause.subscribe(() => {
            console.log('[INFO] App Paused.');
            localStorage.setItem("lastState", this.nav.last().name);
     })

resume() 方法

this.platform.resume.subscribe(() => {
            console.log('[INFO] App resumed);           
            if(null != localStorage.getItem("lastState") && localStorage.getItem("lastState") != undefined) {
                this.nav.push(localStorage.getItem("lastState"));
            }
        });

注意：我已经在app.module.ts中添加了所有组件名称

Answer 1

这种情况是您尝试从页面推送字符串而不是导入的模块，这仅在您在模块中使用延迟加载时才有效。 你有两个选择：

• 延迟加载所有页面组件，以便您可以在 NavController 上将它们用作字符串，而不是导入的模块名称。
• 导入所有页面，用它们创建一个对象并调用this.nav.push(this.yourCreatedObject[localStorage.getItem("lastState")]); 以访问具有模块的对象中的参数（我什至不知道这是否可行，但如果你不这样做，值得一试'不想浪费时间延迟加载）。

只是一个观察：

当您进入暂停状态时，应用程序将保留在暂停前的页面上，无需保存页面并再次推送它，暂停时它不会进入根目录或丢失导航堆栈.这可能对用户体验不利，因为您将在一个页面中然后再次推送同一页面。所以考虑不要这样做。

PS：在 resume 方法的 console.log() 中缺少 '。

希望对你有帮助

编辑

所以如果你想让应用重启你不需要推送页面，你需要去你应用的根页面，所以试试this.nav.popToRoot()。这样您就不需要保存状态或更改为延迟加载。

编辑 2

好的，所以在 15 分钟后重新启动将需要一个计数器，并且您将您的架构更改为延迟加载。

您可以执行以下操作

public timer: any;
public counter: number = 0; // add these 2 variable to the scope of your class in app.components

this.platform.pause.subscribe(() => {
  localStorage.setItem("lastState", this.nav.last().name);
  this.timer = setInterval(()=>{
    this.counter += 50;
  }, 50);
});

this.platform.resume.subscribe(() => {
  const lastState = localStorage.getItem("lastState"); //GET THE LATEST STATE, YOU'LL ALWAYS HAVE ONE BE CAUSE THE APP'LL ALWAYS PAUSE
  clearInterval(this.timer); // CLEAR THE INTERVAL
  if(this.counter < 900000) // IF IT'S UNDER NEEDED TIME. 900000 == 15 min
    this.nav.setRoot(lastState);
  else
    this.nav.popToRoot();
});

这仅在应用程序暂停但未终止时才有效，如果您希望在用户终止并重新启动应用程序时获得相同的行为，那么您将遇到更多问题，例如比较用户最后一次是什么时候打开应用程序，如果不到 15 分钟。