Angular ngx slick在角度2（角度5）中与ng2网格堆栈集成时不工作_Angular_Angular5

Angular ngx slick在角度2（角度5）中与ng2网格堆栈集成时不工作

angular

Angular ngx slick在角度2（角度5）中与ng2网格堆栈集成时不工作,angular,angular5,Angular,Angular5,我在angular 2应用程序中集成了ngx slick和ng2 gridstack。“ngx slick”在集成到“ng2网格堆栈”之前工作良好。我没有收到任何错误消息。我的代码如下 package.json "@angular/animations": "^5.0.0", "@angular/common": "^5.0.0", "@angular/compiler": "^5.0.0", "@angular/core": "^5.0.0", "@angular/forms": "^5.0.

我在angular 2应用程序中集成了ngx slick和ng2 gridstack。“ngx slick”在集成到“ng2网格堆栈”之前工作良好。我没有收到任何错误消息。我的代码如下

package.json

"@angular/animations": "^5.0.0",
"@angular/common": "^5.0.0",
"@angular/compiler": "^5.0.0",
"@angular/core": "^5.0.0",
"@angular/forms": "^5.0.0",
"@angular/http": "^5.0.0",
"@angular/platform-browser": "^5.0.0",
"@angular/platform-browser-dynamic": "^5.0.0",
"@angular/router": "^5.0.0",
"core-js": "^2.4.1",
"ng2-gridstack": "^1.0.0",
"ngx-slick": "^0.1.3",
"rxjs": "^5.5.2",
"zone.js": "^0.8.14"

index.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Slick</title>
    <base href="/">

    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" type="image/x-icon" href="favicon.ico">

    <script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
    <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.css"/>
    <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick-theme.css"/>
    <script src="https://unpkg.com/slick-carousel@1.6.0/slick/slick.js"></script>

</head>
<body>
<app-root></app-root>
</body>
</html>

<gridStack w="12" animate="true" [options]="gridstackOptions">
  <div gridStackItem
      [x]="0" [y]="0" [h]="3" [w]="12" [customid]="10">

      <ngx-slick class="carousel" #slickModal="slick-modal" [config]="slideConfig" (afterChange)="afterChange($event)">
        <div ngxSlickItem *ngFor="let slide of slides" class="slide">
              <img src="{{ slide.img }}" alt="" width="100%">
        </div>
      </ngx-slick>

  </div>
</gridStack>

app.component.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Slick</title>
    <base href="/">

    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" type="image/x-icon" href="favicon.ico">

    <script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
    <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.css"/>
    <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick-theme.css"/>
    <script src="https://unpkg.com/slick-carousel@1.6.0/slick/slick.js"></script>

</head>
<body>
<app-root></app-root>
</body>
</html>

<gridStack w="12" animate="true" [options]="gridstackOptions">
  <div gridStackItem
      [x]="0" [y]="0" [h]="3" [w]="12" [customid]="10">

      <ngx-slick class="carousel" #slickModal="slick-modal" [config]="slideConfig" (afterChange)="afterChange($event)">
        <div ngxSlickItem *ngFor="let slide of slides" class="slide">
              <img src="{{ slide.img }}" alt="" width="100%">
        </div>
      </ngx-slick>

  </div>
</gridStack>

我在html/css/js中有相同的设置，我正在尝试将这些代码集成到angular 2应用程序中。有人能帮我一下吗