Подтвердить что ты не робот

Angular2: MVC, MVVM или MV *?

Angular один из них следовал более или менее принципу дизайна MVV * из-за его двухсторонней привязки данных.

Angular2 использует компонентный интерфейс, концепцию, которая может быть знакома разработчикам React. В некотором смысле, контроллеры и директивы Angular 1.x размываются в новом компоненте Angular 2.

Это означает, что в Angular 2 нет контроллеров и нет директив. Вместо этого компонент имеет селектор, который соответствует тегу html, который будет представлять компонент, и @View, чтобы указать шаблон HTML для заполнения компонента.

Angular2 по-прежнему реализует двустороннюю привязку данных, но не состоит из моделей, например, если у меня есть @Component, который отображает список статей и class, который определяет объект статьи:

class Article {
title: string;
link: string;
votes: number;

constructor(title: string, link: string, votes?: number){
    this.title = title;
    this.link = link;
    this.votes = votes || 0;
}

Это, в шаблоне MVC, будет считаться моделью.

Итак, учитывая, что шаблон дизайна Angular следует ближайшим?

4b9b3361

Ответ 1

Angular 2 на самом деле не MVC (но я полагаю, вы можете провести параллели). Он основан на компонентах. Позвольте мне объяснить:

Angular 1 - MVC и MVVM (MV *). Angular 1 был новаторским по нескольким причинам, но одной из главных причин было то, что он использовал инъекцию зависимостей. Это была новая концепция по сравнению с другими JS Framework, такими как Backbone и Knockout.

Затем React вышел и полностью трансформировал архитектуру переднего конца. Это заставило Front End больше думать о других опциях, кроме MVC и MVVM. Вместо этого она создала идею Component Based Architecture. Это можно рассматривать как одно из самых значительных преобразований архитектуры front-end с HTML и JavaScript.

Angular 2 (и Angular 1.5.x) решили использовать подход React и использовать компонентную архитектуру. Тем не менее, вы можете провести небольшие параллели между MVC, MVVM и Angular 2, поэтому я думаю, что это может быть немного запутанным.

Сказав это, нет контроллеров или ViewModels в Angular 2 (если вы не надели их). Вместо этого есть компоненты, которые состоят из шаблона (например, вида), классов и метаданных (декораторов).

Например, Модели - это классы, в которых хранятся данные (например, контракт данных для хранения данных, возвращаемых службой http с помощью @ angular/http). Мы можем создать новый класс, который добавляет методы и свойства (логику), а затем объединяет модель и класс. Это создает что-то вроде ViewModel. Затем мы могли бы использовать эту ViewModel в нашем Компоненте.

Но для вызова класса компонентов или службы ViewModel или контроллер не совсем корректны. Компонент содержит шаблон и класс. ИМО это немного похоже на Теорию Лискова - утка - не утка - не пытайтесь заставить MVC или MVVM-шаблон в Компоненты по-разному. Подумайте о Angular 2 как о компонентах. Но я могу понять, почему люди проводят параллели, чтобы помочь их первоначальному пониманию.

Angular также использует модули, которые являются частью предстоящей версии JavaScript (ECMAScript 6). Это очень эффективно, потому что JavaScript всегда имел проблемы с пространствами имен и организацией кода. Здесь импортируются и экспортируются компоненты.

Полезные ссылки:

https://medium.com/javascript-scene/angular-2-vs-react-the-ultimate-dance-off-60e7dfbc379c

Есть angular2 mvc?

http://malcoded.com/angular-2-components-and-mvvm

Ответ 2

Оба Angular 1 и Angular 2 следуют шаблону MVC (модель, вид, контроллер).

В Angular 1, HTML-разметка - это вид, контроллер - это Контроллер, а Служба (когда он используется для извлечения данных) - это модель.

В Angular 2 шаблон - это вид, класс - это контроллер, а служба (когда он используется для извлечения данных) - это модель.

Поскольку Angular представляет собой структуру клиентской стороны, шаблон MVC Angular следует вызывать как MVVC (Model, View, View Controller).

Ответ 3

Я не слишком увлечен использованием обозначений M ** (вроде злоупотребления и туманности). В любом случае, на мой взгляд, самый простой и эффективный способ сказать, что в Angular2:

класс (статья в вашем случае) представляет модель

Компонент объединяет представление (в шаблоне) и контроллер (логика Typescript)

Я надеюсь, что это поможет

Ответ 4

В Angular (исключая версию 2 и выше) мы используем функцию привязки данных. Эта функция привязки данных применяет шаблон MVVM в приложении ng, поскольку контроллер в этом случае вызывает привязку между V & M (изменения в представлении приводят к изменению модели и наоборот). Таким образом, в терминологии MVC мы можем заменить 'C' на "VM", MVVM