Angular2入门--架构概览
Angular 介紹
Angular 是一款來自谷歌的開源的web前端框架,誕生于2009年,是一款優秀的前端JS框架,已經被用于谷歌的多款產品。
Angular 基于Typescript開發 ,更適合中大型企業級的項目。
學習Angular的必備基礎
html、css、js、es6、Typescript.
載入需要的庫
推薦使用npm來作為包的管理工具
組件
component定義對象是一個angular組件,接收一個包含兩個屬性的配置對象
selector:為HTML元素定義了一個CSS選擇器my-app
template: 屬性容納著組件的模板
@Component{
selector:‘my-app’,
templateUrl: ''
}
模塊
angular應用都是模塊化的
Class定義對象
在Class方法中,我們可以給組件添加屬性和方法
定義一個Class類
定義一個構造函數
.Class({
constructor: function(){}
})
添加NgModule
angular應用是由angular模塊組成
app.AppModule = ng.core.NgModule({
imports: [ ng.platformBrowser.BrowserModule ],
declarations: [ app.AppComponent ],
bootstrap: [? app.AppComponent ]
})
啟動應用
添加app/main.js文件
我們需要兩樣東西來啟動應用:
1.angular的platformBrowserDynamic().bootstrapModule 函數
2.應用根模塊Appmodule
執行過程為:當angular在main.js中調用bootstrapModule函數時,它讀取AppModule的元數據,在啟動組件中找到AppComponent并找到my-app選擇器,定位到元素,然后在這個標簽之間載入內容。
Angular2 Typescript
Typescript是一種由微軟開發的自由開源的編程語言,它是JavaScript的一個超集,擴展了JavaScript的語法。
數據綁定
有兩種類型的數據綁定:
1. 事件綁定 讓你的應用可以通過更新應用的數據來響應目標環境下的用戶輸入。
2. 屬性綁定 讓你將從應用數據中計算出來的值插入到HTML中。
Angular 支持雙向數據綁定,這意味著DOM中發生的變化同樣可以反映回你的程序數據中。
依賴注入
依賴注入器會為組件提供一些服務,比如路由器服務就能讓你定義如何在視圖之間導航。
?
轉載于:https://www.cnblogs.com/veraNotes/p/10799440.html
總結
以上是生活随笔為你收集整理的Angular2入门--架构概览的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 何为优秀的机器学习特征 zz
- 下一篇: Django基础——ORM字段和字段参数