Question

我想将我的应用程序用作其他网页上的iframe。但是，因此，我需要在应用程序的“ stripped”版本中禁用某些功能。

通常，我使用url /＃/ ...导航。对于iframe，它是url /＃/ iframe / ...。它们都导航到相同的页面，尽管在后者中某些功能已被禁用。

我的问题是我想在div周围放置一个router-outlet，并根据我是否处于iframe模式来设置一个类。目前，我只能考虑检查

this.route.snapshot.url[0].path === 'iframe'

在car.component.ts文件中，将此值存储为appService.iframe在app.service.ts中的某个位置，然后在app.component.html中使用此值。

但是，这会产生以下错误：

ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'body1'. Current value: 'body2'.

我可以在加载路由器之前获取url吗？

app.routes.ts文件：

// Route Configuration
export const routes: Routes = [
  {path: '', component: CarList},
  {path: 'iframe', component: CarList},
  {path: 'iframe/:loket', component: Car},
  {path: ':loket', component: Car}
];

// Export routes
export const routing = RouterModule.forRoot(routes);

app.component.html文件：

 <div class="container">
      <div class="header">
        <header></header>
      </div>  
      <div [ngClass]="(!appService.iframe) ? 'body1': 'body2'">
        <router-outlet></router-outlet>
      </div>
      <div class="footer">
        <footer></footer>
    </div>    
</div>

Answer 1

使用原生location.hash，您可以确定它是否包含iframe值：

location.hash.includes("iframe")

Angular-在加载路由器之前获取路由器网址

1 个答案: