在Angular 7中，当使用ViewChild引用模态框时，可能会引发错误并且无法识别模态框。这是因为在Angular 7中，ng-template元素被视为不可访问的元素，无法使用ViewChild引用。为了解决这个问题，可以使用ViewChildren来引用模态框。

以下是一个示例代码，展示如何使用ViewChildren来解决这个问题：

1. 在HTML模板中，使用ng-template来定义模态框，并为其添加一个模板引用变量：

2. 在组件类中，使用ViewChildren来引用模态框，并使用QueryList来获取模态框元素的引用：

import { Component, ViewChildren, QueryList, AfterViewInit } from '@angular/core';

@Component({
  selector: 'app-example',
  templateUrl: 'example.component.html',
  styleUrls: ['example.component.css']
})
export class ExampleComponent implements AfterViewInit {
  @ViewChildren('modal') modals: QueryList;

  ngAfterViewInit() {
    // 访问模态框元素
    this.modals.forEach(modal => {
      console.log(modal);
    });
  }
}

通过以上步骤，您将能够成功引用模态框元素，并使用它们进行进一步的操作。请注意，由于ViewChildren返回的是一个QueryList对象，您可能需要使用forEach或其他方法来访问单个模态框元素。