要解决子div超出父div的问题，你可以使用Angular FlexLayout提供的flex属性和自定义CSS样式。

首先，确保已经安装了Angular FlexLayout库。可以使用以下命令进行安装：

npm install @angular/flex-layout --save

接下来，你可以在你的代码中使用Angular FlexLayout的flex属性来控制子div的尺寸和位置。例如，你可以将子div的flex属性设置为1，使其填充父div的剩余空间。同时，你可以将子div的overflow属性设置为auto，以便它可以滚动并在超出父div时显示滚动条。

在组件的HTML模板中，使用以下代码示例：

在上面的示例中，父div使用了flex布局，并设置了固定的高度和宽度。子div的flex属性设置为1，以填充父div的剩余空间。子div还设置了overflow属性为auto，以便它可以滚动并显示滚动条。

你还可以根据需要自定义CSS样式来调整父div和子div的外观。在上面的示例中，父div使用了1像素的黑色边框，你可以根据需要进行调整。

注意：为了使Angular FlexLayout的flex属性正常工作，确保在你的模块中导入FlexLayoutModule，并将其添加到imports数组中：

import { FlexLayoutModule } from '@angular/flex-layout';

@NgModule({
  imports: [FlexLayoutModule],
  // 其他配置
})
export class YourModule { }

通过以上方法，你就可以解决子div超出父div的问题，并通过滚动条显示超出的内容。