Question

如何在启动 dom 和数据之前重定向到主页？

2018-05-27

75

angular angular5

我有 3 个页面，第 2 个页面向第 3 个页面提供数据。它工作正常。问题是当用户刷新第 3 个页面时，我想导航到主页。因为第 3 个页面没有可用的数据。

我尝试这样做：

constructor(private store: StorageService, 
      private sharedData: SharedDatasService, 
      private location:Location,
      private route:Router) {

      console.log('this.sharedData.validationDatas', this.sharedData.validationDatas );

      if(Object.keys(this.sharedData.validationDatas).length === 0 ) { //there is not data.. go to home.
          this.route.navigate(['']);
          return;
      }

    }

但我仍然收到来自 DOM 编译的错误。并且我的页面根本没有重定向到主页...

如何处理？

我收到的错误：

TypeError: Cannot read property 'book.label.title.packageSizes' of undefined

Answer 1

您可以使用 Route Guards 来实现这一点。

在您的 路由配置

const routes: Routes = [
{ path: 'secondPage', component: SecondPage},
  {
    path: 'thridpage',
    component: ThridPage,
    canActivate: [DataCheckRouteGuard],
  }
];

DataCheckRouteGuard

import { CanActivate } from '@angular/router';
import { Injectable } from '@angular/core';
import { sharedData} from './SharedDatasService';

@Injectable()
export class DataCheckRouteGuard implements CanActivate {

  constructor(private sharedData: SharedDatasService) {}

  canActivate() {
  if(this.sharedData.validationDatas!==undefined) 
   {
     return true;
   } else 
   {
   // No data so navigate to second page
    this.router.navigate(['/secondPage'] 

    return false
   }
  }
}

路由的使用

Answer 2

我根据条件更改了我的 HTML 标签，现在它工作正常。

这是更新：

以前是：

{{getLabel('book.label.title.packageSizes')}}

现在是：

{{getLabel('book?.label.title.packageSizes')}}