如何在Angular 2中解释MVC模式?

Vis*_*ngh 9 angular

Angular找到了一个有用的博客:MVC实现,但仍在为Angular 2寻找好的解释

Dyl*_*eus 16

一般

我认为这种模式确实与语言无关.也就是说,设计/体系结构模式相当抽象,并且在不同语言中实现它们遵循这种更抽象的表示.这并不是说我们不能在给定一个示例语言(如C#或Java)或示例框架(如Angular2)时使其更具体.

鉴于您已经阅读了MVC模式的一些来源,我假设您已经了解了模式在其抽象形式中的样子.它是模型,视图和控制器的分离.我不会进一步深入到这个抽象的介绍.我们来看看Angular2吧.

Angular2专用

假设您正在使用angular2-cli.创建新组件时,会为您生成一堆文件.重要的是结束component.htmlcomponent.ts理解MVC的那些.这些分别是视图和控制器.HTML是呈现给用户的内容(以及一些用于布局的CSS).很容易看出这代表了视图.在它旁边,我们有附带的component.ts文件.这是控制器.从本质上讲,它可以选择使用各种形式的绑定推送到我们的视图(.html)的数据.

如果不使用angular2-cli,可以将它们合并到一个文件中.HTML部分是我们的视图,我们的控制器是Typescript.

最后,我们有模型.在angular2中,模型将主要是我们的services,我们可以通过我们的控制器访问.(旁注:服务可以被视为另一种模式,单身模式.旁注旁注:在大多数情况下都是如此,但在SO上寻找一些解决方法))

虽然我们的模型可以超越这个范围.我们的"后端"可以有更多的类,例如我们的服务用于处理或存储信息.这也属于我们的模型.我们可以有一个类文件Person.PersonService然后,A 可以管理一个数组Person.我们可以说这Person仍然是一个模型类.


pix*_*its 9

Angular2遵循MVC模式.模型由工厂和服务表示,可以通过依赖注入将其注入组件类构造函数.Controller是组件类; 工厂和服务通常在类构造函数中注入到Component类中,然后用于设置类成员变量.View是组件模板,它绑定到组件类成员变量.

在此输入图像描述