来自ng2-bootstrap的Carousel导致Angular Universal陷入循环

Question

我对ng2-bootsrap carousel有点问题。当页面中的轮播代码被注释掉时，页面(/home2)加载正常。但是当carousel代码运行时，浏览器将一直等待服务器为页面提供服务(服务器永远不会这样做)，导致页面为空。仅供参考，我使用的是Angular Universal Starter项目。

以下是home2组件中myInterval设置为5000的轮播代码：

<carousel [interval]="myInterval" [noWrap]="noWrapSlides">
            <slide *ngFor="let slidez of slides;let index=index" [active]="slidez.active">
               <!-- <img [src]="slidez.image">-->
                <div class="carousel-caption">
                    <h4>Slide {{index}}</h4>
                    <p>{{slidez.text}}</p>
                </div>
            </slide>
            <i class="fa fa-chevron-left left carousel-control"></i>
            <i class="fa fa-chevron-right right carousel-control"></i>
        </carousel>

以下是服务器端的输出(express)：

GET /home2 - - ms - -
inside ngApp
/home2
GET /home2 - - ms - -
nginside ngApp
/home2
GET /home2 - - ms - -
inside ngApp
/home2
GET /home2 - - ms - -

以下是服务器上的控制台日志语句：

function ngApp(req, res) {
  console.log("inside ngApp");
  console.log(req.originalUrl);
  res.render('index', {
    req,
    res,
    // time: true, // use this to determine what part of your app is slow only in development
    preboot: false,
    baseUrl: '/',
    requestUrl: req.originalUrl,
    originUrl: `http://localhost:${ app.get('port') }`
  });
}

在我看来，Angular Universal陷入了一个循环。下面是实现:禁用间隔的interior design ideas，以避免无限循环。如果有人能告诉我如何解决这个问题，我将不胜感激。任何建议都将不胜感激。

谢谢

Answer 1

我也有同样的问题，但找到了解决方案，ng2-bootstrap使用浏览器元素，并需要等待，直到应用程序引导在客户端你必须创建自己的轮播兼容通用或与*ng2如果等待引导，你必须在组件检查与以下代码：

import {isBrowser} from "angular2-universal";

if (isBrowser) {
  //example 
    this.showCarousel = true;
}