angularjs报错:XXX.inject is not a function

查了一圈,网上都是其他的XXX is not a function,他们的说是根模块禁止$监听
我在制作图片滚播时,在vscode里不会报错,但是在chrome里开发者工具提示我如下错误,并且图片也是竖直排列,并没有轮播。

backend.js:32708 Uncaught TypeError: rootNgProbe.inject is not a function
at Angular2Adapter._trackAngularChanges (backend.js:32708)
at Angular2Adapter.setup (backend.js:32704)
at Object. (backend.js:33421)
at webpack_require (backend.js:20)
at Object. (backend.js:47)
at webpack_require (backend.js:20)
at backend.js:40
at backend.js:43

代码片段如下:
css:

.container {
    position: relative;
    overflow: hidden;
}

.container.image-slider {
    display: flex;
    overflow-x: scroll;
}

.nav-section {
    position: absolute;
    bottom: 0;
    width: 100%;
    opacity: 0.5;
    color: #fff;
    background-color: #000;
    display: flex;
    justify-content: flex-end;
    align-items: stretch;
}

.nav-section.slide-button {
    display: flex;
    width: 10px;
    height: 10px;
    background-color: #fff;
    text-decoration: none;
    border-radius: 50%;
    margin: 5px;
}

html:

<div class="container">
    <div class="image-slider">
        <img *ngFor="let slider of sliders"  [src]="slider.imgUrl" [alt]="slider.caption">
    </div>
    <div class="nav-section">
        <span *ngFor="let _ of sliders; let idx = index" class="slide-button">

        </span>
    </div>
</div>

ts:

import { Component, OnInit, Input, ViewChild, ElementRef } from '@angular/core';

export interface ImageSlider {
  imgUrl: string;
  link: string;
  caption: string;
}

@Component({
  selector: 'app-image-slider',
  templateUrl: './image-slider.component.html',
  styleUrls: ['./image-slider.component.css']
})
export class ImageSliderComponent implements OnInit {

  @Input() sliders: ImageSlider[] = [];
  constructor() { }

  ngOnInit() {
  }

}

https://blog.csdn.net/weixin_30590285/article/details/94924876