Ответ 1

Позвольте мне в предисловии сказать, что я предполагаю, что вы и все, кто будет читать это, уже комфортно с Angular 1 (теперь называется AngularJS, а не просто Angular для более новых версий). При этом давайте рассмотрим некоторые дополнения и ключевые отличия в Angular 2+.

1. Они добавили angular cli.

Вы можете начать новый проект, запустив ng new [app name]. Вы можете обслуживать свой проект, запустив ng serve узнать больше здесь: https://github.com/angular/angular-cli

2. Ваш angular код написан на ES6 Typescript и компилируется во время выполнения в Javascript в браузере.

Чтобы получить полное представление об этом, я рекомендую проверить список ресурсов, который у меня есть в нижней части моего ответа.

3. Структура проекта

В базовой структуре у вас будет папка app/ts, в которой вы будете выполнять большую часть своей работы, и папка app/js, которую вы найдете в папке app/js с расширением .js.map. Они "сопоставляют" ваши ".ts" файлы с вашим браузером для отладки, так как ваш браузер не может читать машинописный текст.

Обновление: это из бета-версии. Структура проекта немного изменилась, в большинстве случаев, и если вы используете угловое ограничение, вы будете работать в Папка src/app/. В стартовом проекте у вас будет следующее.

app.component.css 
app.component.html
app.component.spec.ts
app.component.ts 
app.module.ts
index.ts

app.component.css: файл CSS, который вы должны использовать специально для component.html

app.component.html: представление (переменная, объявленная в app.component.js)

app.component.spec.ts: используется для тестирования app.component.ts

app.component.ts: ваш код, который связывается с app.component.html

app.module.ts: это то, что запускает ваше приложение и где вы определяете все плагины, компоненты, сервисы и т.д. Это эквивалент app.js в Angular 1

index.ts используется для определения или экспорта файлов проекта

Дополнительная информация:
Совет для профессионалов: вы можете запустить ng generate [option] [name] для создания новых сервисов, компонентов, каналов и т.д.

Также важен файл tsconfig.json, так как он определяет правила компиляции TS для вашего проекта.

Если вы думаете, что мне нужно выучить совершенно новый язык?... Э-э... вроде, TypeScript - это расширенный набор JavaScript. Не пугайтесь; это там, чтобы сделать ваше развитие проще. Я почувствовал, что уже через несколько часов поиграл с этим, и через 3 дня все закончилось.

4. Вы привязываете к своему HTML так же, как если бы это было в директиве Angular 1. Такие переменные, как $scope и $rootScope устарели.

Это тот, который вы могли подразумевать. Angular 2 по-прежнему является MV *, но вы будете использовать компоненты как способ привязки кода к вашим шаблонам, например, возьмите следующий

    import { Component } from '@angular/core';

    @Component({
         selector:'my-app',
         template: '<h1> Hello World! </h1>'
    })

    export class AppComponent {}

Здесь воспринимайте оператор import как внедрение зависимости в контроллере v1. Вы используете import для импорта ваших пакетов, где import {Component} говорит, что вы создадите component, который вы хотите привязать к вашему HTML.

Обратите внимание на декоратор @Component, у вас есть selector и template. Здесь представьте себе selector как свой $scope, который вы используете, как вы используете v1 directives, где имя selector - это то, что вы используете для привязки к вашему HTML, например, так

<my-app> </my-app>

Где <my-app> - это имя вашего пользовательского тега, который вы будете использовать в качестве заполнителя для того, что объявлено в вашем шаблоне. т.е.) <h1> Hello World! </h1>. Принимая во внимание, что это будет выглядеть следующим образом в v1:

HTML

<h1>{{hello}}</h1>

JS

$scope.hello = "Hello World!"

Также вы можете добавить что-то между этими тегами для создания сообщения о загрузке, например:

<my-app> Loading... </my-app> 

Затем в качестве сообщения о загрузке будет отображаться "Идет загрузка...".

Обратите внимание, что в template объявлен путь или необработанный HTML-код, который вы будете использовать в своем HTML в теге selector.

Более полная реализация Angular 1 будет выглядеть примерно так:

HTML

<h1 ng-controller="myCtrl">{{hello}}</h1>

В версии 1 это будет выглядеть примерно так:

JS

angular.module('controller', [])



.controller('myCtrl', function( $scope) {
    $scope.hello = "Hello World!"
})

Это то, что мне действительно нравится в v2. Я обнаружил, что директива была крутой кривой обучения для меня в v1, и даже когда я их выяснил, у меня часто был рендеринг CSS не так, как я планировал. Я считаю, что это намного проще.

V2 обеспечивает более легкую масштабируемость вашего приложения, так как вы можете разбить свое приложение проще, чем в v1. Мне нравится такой подход, так как все ваши рабочие части могут быть в одном файле, а не в angular v1.

Как насчет преобразования вашего проекта из v1 в v2?

Из того, что я слышал от команды разработчиков, если вы хотите обновить проект v1 до v2, вы просто удалите устаревшие большие двоичные объекты и замените $scope на selector. Я нашел это видео полезным. Это с некоторыми из команды Ionic, которые работают бок о бок с командой angular, так как v2 больше фокусируется на мобильных устройствах https://youtu.be/OZg4M_nWuIk Надеюсь, это поможет.

ОБНОВЛЕНИЕ: Я обновился, добавив примеры, когда появились официальные реализации Angular 2.

ОБНОВЛЕНИЕ 2: Это все еще кажется популярным вопросом, поэтому я просто подумал, что я нашел какой-то ресурс, который мне очень пригодился, когда я начал работать с angular 2.

Полезные ресурсы:

Для получения дополнительной информации о ES6 я рекомендую ознакомиться с учебниками по новым функциям в Бостоне ECMAScript 6/ES6 - плейлист YouTube

Чтобы написать функции Typescript и посмотреть, как они компилируются в Javascript, ознакомьтесь с игровой площадкой на языке Typescript

Чтобы увидеть разбивку функций по эквивалентности Angular 1 в Angular 2, см. Angular.io - Cookbook -A1 A2. Краткое руководство

Ответ 2

Это может помочь вам узнать об Angular 1 против Angular 2.

У Angular 2 оказалось много преимуществ по сравнению с Angular 1:

• Он полностью основан на компонентах.
• Лучшее обнаружение изменений
• Ahead of Time compilation (AOT) улучшает скорость рендеринга.

• TypeScript можно использовать для разработки приложений Angular 2

• Angular 2 имеет лучшую производительность, чем Angular 1.

• Angular 2 имеет более мощную систему шаблонов, чем Angular 1.

• Angular 2 имеет более простые API, ленивую загрузку, более легкую отладку.

• Angular 2 гораздо более тестируем, чем Angular 1.

• Angular 2 предоставляет вложенные компоненты.

• Angular 2 предоставляет возможность выполнять более двух систем одновременно.

• И так далее..

Ответ 3

Angular 2 и Angular 1 - это в основном разные фреймворки с одинаковыми именами.

Angular 2 более готов к текущему состоянию веб-стандартов и будущему состоянию сети (ES6\7, неизменность, компоненты, теневой DOM, сервисные работники, совместимость с мобильными устройствами, модули, машинопись и т.д. и т.д. и т.д.)

angular 2 убил много основных функций в angular 1 like - контроллеры, $ scope, директивы (заменены аннотациями @component), определение модуля и многое другое, даже такие простые вещи, как ng-repeat, не оставили прежних.

В любом случае, изменения - это хорошо, у angular 1.x есть недостатки, и angular 2 более готов к будущим веб-требованиям.

Подводя итог - я не рекомендую вам начинать проект angular 1.x сейчас - это, вероятно, самое плохое время для этого, поскольку вам придется перейти позже на angular 2, я решил, что вам больше нравится angular, чем выбрать angular 2, Google уже запустил проект с Angular 2, и к тому времени, как вы закончите проект, Angular 2 уже должен быть в центре внимания. если вам нужно что-то более стабильное, вы можете думать о реакции \elm, flux и redux как о JS-фреймворках.

Angular 2 будет потрясающим, это без сомнения.

Ответ 4

Нет рамки идеально подходит. Вы можете прочитать о недостатках в Angular 1 здесь и здесь. Но это не значит, что это плохо. Вопрос в том, какую проблему вы решаете. Если вы хотите быстро развернуть простое, легковесное приложение с ограниченным связыванием данных use, продолжайте использовать Angular 1. Angular 1 был построен 6 лет назад для решения задач быстрого прототипирования, что довольно неплохо. Даже если ваш вариант использования сложен, вы все равно можете использовать Angular 1, но тогда вам следует знать о нюансах и лучших практиках создания сложного веб-приложения. Если вы разрабатываете приложение для целей обучения, я бы посоветовал перейти на Angular 2, так как именно здесь будущее Angular.

Ответ 5

Единственная отличительная особенность в Angular v2, а также в ReactJs заключается в том, что они оба приняли новую архитектуру разработки Web-Components. Это означает, что теперь мы можем создавать независимые веб-компоненты и подключать их к любому веб-сайту в мире, который имеет тот же самый пакет технологий этого веб-компонента. Круто! да очень круто.:)

Другим наиболее заметным изменением в Angular v2 является то, что основным языком разработки является не что иное, как TypeScript. Хотя TypeScript принадлежит Microsoft, и это надмножество JavaScript 2015 (или ECMAScript6/ES6), но у него есть некоторые функции, которые очень перспективны. Я бы рекомендовал читателям проверить TypeScript в деталях (что интересно, конечно) после прочтения этого урока.

Здесь я бы сказал, что ребята, пытающиеся взаимодействовать с Angular v1 и Angular v2, еще больше запутывают читателей, и по моему скромному мнению, Angular v1 и Angular v2 следует рассматривать как две разные структуры. В Angular v2 у нас есть концепция веб-компонентов для разработки веб-приложений, а в Angular v1 мы должны играть с контроллерами, и (к сожалению или к счастью) никакие контроллеры не присутствуют в Angular v2.

Ответ 6

Одно замечание: angular2 использует typescript.

Я сделал angular1 с кордорой в моем стажере, и теперь я делаю angular 2. Я думаю, что angular2 будет трендом, поскольку он более структурирован по моему мнению, но недостатки в том, что ресурсов есть немного, у вас есть проблемы или трудности. angular 1.x имеет множество персонализированных директив, которые могут быть очень просты в использовании.

Надеюсь, что это поможет.

Ответ 7

Angular 2 намного лучше, чем 1, список в том, что он предлагает, поддержка веб-компонентов, использование typescript, предварительная подготовка и общая простота интерфейса, была причиной того, что я решил запустить проект с помощью angular 2. Как бы то ни было, я понял, что есть проблемы в angular 2 (от exmple routing с apache), для которых очень мало или нет документации, поэтому документация и сообщество angular 2 - самая большая ошибка для angular 2, так как он недостаточно развит.

Я бы сказал, если вам нужно быстро поднять сайт за короткий срок, используйте известный angular 1, если вы в более длинном проекте и можете позволить себе время для изучения новых проблем (что вы, возможно, первый чтобы столкнуться, что может быть бонусом, если вы подумаете о вкладе, который вы можете дать сообществу angular 2), чем пойти с angular 2.