在角度2中重复使用模态的最佳方式

Question

在我的项目中，我使用不同的模态编辑，添加。我想重复使用Modal所以我不需要一直重写它。我怎么做？什么是重用模型的最佳方式。任何人都可以给我一个例子吗？我查了其他问题，但我无法正确理解它们。因为我对角度很陌生。任何帮助将非常感激。

Answer 1

解决这个问题的最好方法是创建一个模态组件。 该组件应该有一个模板，它只是模态代码，允许将内容传递给组件的每个实例。

如果您对角度不熟悉，可能需要遵循https://angular.io/的一些教程，因为有些概念会引起混淆。此外https://angular.io/guide/component-interaction对如何做到这一点

您的组件的详细信息可以有一个定义：

@Component({ 
    selector: 'my-dialog', 
    templateUrl: './dialog.html' 
}) 

然后在dialog.html：

<div #container> 
    <ng-content></ng-content> 
</div> 

#container代表你的对话框代码，并在你的对话框是指令<ng-content>告诉角度来放置你在组件实例中使用的任何内容。然后，您将使用如下对话框：

<my-dialog> 
    <p>this content will appear in the dialog</p> 
</my-dialog>