1

我正在尝试解决无法使用 UpgradeModule 降级 Angular 8 @Directive 的问题。

我有一个嵌套的角度材质组件，需要挂钩到 cdkScrollable。我的层次结构如下所示：

<div class="some-class-that-allows-scroll"> <-- angularjs scrollable component
  <mat-form-field></mat-form-field> <-- angular 8 component that needs cdkScrollable on parent

无法将 cdkScrollable 指令降级以在 angularjs、IE 中工作

<div cdkScrollable class="some-class-that-allows-scroll"> <-- Will not work in angularjs template
  <mat-form-field></mat-form-field>

由于我无法降级 cdkScrollable @directive 我试图将该指令“包装”在可重用的 angular 8 组件中，然后降级该组件。

IE：Angular 8 组件：

import { Component } from '@angular/core';

@Component({
  selector: 'scroll-wrapper',
  templateUrl: './scroll.component.html',
  styleUrls: ['./scroll.component.scss']
})
export class ScrollWrapperComponent {

  constructor() { }

}

模板：

<div cdkScrollable>
  <ng-content></ng-content>
</div>

在 angularjs 模板中使用该降级组件时：

<scroll-wrapper>
  <div class="some-class-that-allows-scroll"> <-- angularjs scrollable component
    <mat-form-field></mat-form-field> <-- angular 8 component that needs cdkScrollable on parent
  </div>
</scroll-wrapper>

但是，当这样做时，可滚动类和 cdkScrollable 指令不会在同一个元素上结束。有没有办法创建一个包装另一个组件的角度 8 组件并将 cdkScrollable 指令应用于被包装的同一元素？

4

0 回答 0