ts实现走马灯高度自适应

要实现走马灯高度自适应，可以使用以下步骤：

1. 首先需要确定走马灯的容器，可以使用 `ref` 或者 `DOM` 元素的方式来获取容器的高度。

2. 然后在走马灯的 `CSS` 样式中设置 `height` 为 `100%`，这样就能让走马灯的高度自适应容器的高度。

3. 接着，在走马灯的 `ts` 代码中监听容器的高度变化，可以使用 `ResizeObserver` 或者 `window.onresize` 来监听容器高度变化。

4. 当容器高度变化时，重新计算走马灯的高度，并设置为容器的高度。

以下是一个简单的实现示例：

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

@Component({
  selector: 'app-carousel',
  template: `
    <div #container class="carousel-container">
      <div class="carousel" [style.height]="height + 'px'">
        <!-- 走马灯内容 -->
      </div>
    </div>
  `,
})
export class CarouselComponent implements OnInit {
  @ViewChild('container') containerRef!: ElementRef<HTMLDivElement>;

  height = 0;

  constructor() {}

  ngOnInit(): void {
    // 初始化走马灯高度
    this.setHeight();

    // 监听容器高度变化
    const observer = new ResizeObserver(() => {
      this.setHeight();
    });
    observer.observe(this.containerRef.nativeElement);
  }

  setHeight() {
    const containerHeight = this.containerRef.nativeElement.offsetHeight;
    this.height = containerHeight;
  }
}

在上面的示例中，通过 `ViewChild` 获取了容器的 `DOM` 元素，然后在 `ngOnInit` 中初始化了走马灯的高度，并使用 `ResizeObserver` 监听了容器高度的变化，当容器高度变化时，重新计算走马灯的高度，并设置为容器的高度。这样就能实现走马灯的高度自适应容器的高度。