I. Angular 2 là gì ?Angular 2 là một trong những framework UI để xây dựng ứng dụng web bên trên desktop cùng sản phẩm điện thoại.Nó được thiết kế dựa vào Javascript. Chúng ta hoàn toàn có thể cần sử dụng nó để gây ra 1 vận dụng client side thú vị cần sử dụng HTML, CSS cùng Javascript.Angular 2 có nhiều cải tiến so với Angular 1 nhằm dễ ợt học với cải tiến và phát triển các vận dụng đồ sộ doanh nghiệp lớn.Với angular 2 thì bọn họ thuận lợi xây đắp được 1 vận dụng rất có thể tiện lợi mở rộng, gia hạn, kiểm nghiệm với chuẩn chỉnh hóa vận dụng của chính bản thân mình.II. Các công dụng vào angular 2

Dưới đấy là các chức năng rất nổi bật trong angular 2

Two-way data bindingĐây là 1 trong những trong số những nhân kiệt hay cùng với tốt nhất trong angular 2. Dữ liệu được binding một cách tự động hóa với nhanh chóng, phần nhiều biến hóa vào view sẽ tiến hành tự động hóa update vào trong những component class.Powerful routing supportAngular 2 cung cấp trẻ trung và tràn trề sức khỏe các routing trải qua biện pháp tải trang không đồng hóa trên cùng 1 trang chất nhận được họ tạo nên 1 single page application.Expressive HTMLAngular 2 chất nhận được họ cần sử dụng các cấu tạo lập trình nhỏng câu lệnh if, vòng lặp for, .. để render với kiểm soát và điều hành những trang HTML.Modular by designAngular 2 có phong cách thiết kế theo phía modul hóa nhằm tổ chức và quản lý code một cách giỏi rộng.Built in back over supportAngular 2 được xuất bản để cung ứng vấn đề tiếp xúc với back-over servers và thực hiện ngẫu nhiên business súc tích hoặc mang tài liệu.Active sầu communityAngular 2 được cung ứng vày google với có 1 xã hội đông đảo sẵn sàng cung cấp cùng lời giải bất kể thắc mắc như thế nào của chúng ta.III. Sự khác biệt tại chính giữa angular 1 cùng angular 2

1. Hỗ trợ ES6

Angular 2 hoàn toàn được viết bằng Typescript. Điều kia đồng nghĩa tương quan là nó cung ứng cho ES6 Modules, class frameworks, ..

Bạn đang xem: Angular 2 là gì

2. Components là một trong những controller mới

Trong angular 1 chúng ta gồm controllers còn trong angular 2 thì controller được sửa chữa bởi vì components.Controller với view trong angular 1 được quan niệm nlỗi sau.

//Viewbody toàn thân ng-controller=’appController’> h1>vm.messageh1>/body>//Controllerangular.module(‘app’).controller(‘appController’,appcontroller) message=’Hello Angular2’;Còn trong angular 2 thì chúng ta sử dụng component.

import Component from "
Component( selector: "app", template: "message ")export class AppComponent message: string=’Hello Angular2’;Trong angular 2, 1 component đại diện cho một trong những phần tử UI. Chúng ta có thể có không ít component trong một single website page. Các component là hòa bình với nhau cùng quản lý 1 vùng của trang. Component hoàn toàn có thể tất cả component bé với component cha.

3. Directives

Angular 1 có không ít directives. Và một vài directives được thực hiện các tuyệt nhất là ng-repeat và ng-if.

ul> li ng-repeat =customer in vm.customers> customer.name /li>/ul> div ng-if=”vm.isVIP”> h3> VIP Customer /h3>/div>Trong angular 2 cũng đều có directives tuy vậy với 1 cú pháp không giống. Nó có 1 vệt * trước tên của directives.

Xem thêm: Tổng Hợp 4 Cách Sửa Lỗi Idm Báo Fake Serial Number Của Idm, Không Download Được

ul> li *ngFor =#customer of customers> customer.name /li>/ul> div *ngIf=”vm.isVIP”> h3> VIPhường Customer /h3>/div>Trong angular 2 ng-style, ng-src , ng-href đang biến mất với chúng được sửa chữa vị property binding.Việc sinh sản 1 custom directives là cực kỳ đơn giản dễ dàng vào angular 2


Directive( selector: "")class MyDirective sầu

4. Data Bindings

4.1 Interpolation

//Angular 1h3> vm.customer.Name/h3> //Angular 2h3> customer.Name/h3>

4.2 One way Binding

//Angular 1h3> ng-bind=vm.customer.name>/h3> //Angular 2h3 =”customer.name” >/h3>Trong angular 2, bạn cũng có thể bind cho bất kể nằm trong tính làm sao của phần tử html

4.3 Event Binding

//Angular 1button ng-click=”vm.save()”>Savebutton> //Angular 2button (click)=”save()”>Savebutton>Trong angular 1 sử dụng directive sầu ngCliông xã để bind 1 sự kiện còn vào angular 2 directive ngClichồng đã làm được đào thải với bạn có thể bind trực tiếp nối DOM events.

4.4 Two- way binding

//Angular 1input đầu vào ng-model=”vm.customer.name”> //Angular 2input <(ng-model)>=”customer.name”>

5. Filters được đổi tên thành Pipes

Trong angular 1, họ cần sử dụng Filters nhỏng sau

td> uppercase/td>Còn trong angular 2 họ cũng dùng 1 cú pháp tựa như nhưng lại tên chúng là pipes

td> uppercase/td>

6. Platsize specific Bootstrap

Trong angular 1 thì chúng ta dùng directive ng-phầm mềm trong HTML

body toàn thân ng-app=’app’>Còn vào angular 2 thì nó sẽ phức hợp hơn 1 chút ít

*

import platformBrowserDynamic from "
angular/platform-browser-dynamic";import AppModule from "./phầm mềm.module"; platformBrowserDynamic().bootstrapModule(AppModule);

7. Services

Trong angular 1 bao gồm Services, Factories , Providers, Constants với values cùng bọn họ injected vào vào controller để rất có thể sử dụng, còn trong angular 2 toàn bộ đều thiết bị bên trên phần đa được gộp vào Service.Class

Hy vọng qua nội dung bài viết này sẽ giúp đỡ các bạn có 1 tầm nhìn tổng quan liêu về angular 2. ThankyouLink tìm hiểu thêm : angular2