Angularjs 總結(jié)

官方網(wǎng)站

angular是什么:為動(dòng)態(tài)web應(yīng)用設(shè)計(jì)的結(jié)構(gòu)框架蔗包;

核心的功能:

1蛛壳,雙向數(shù)據(jù)綁定:實(shí)現(xiàn)了model和view的完全綁定在一起寞缝,model變化派敷,view也變化蛹批,反之亦然;


上面是一個(gè)小例子篮愉;

2腐芍,模板:

模板相當(dāng)于html文件被瀏覽器解析到DOM中,angular把模板當(dāng)做是Dom來(lái)操作试躏,去生成一些指令來(lái)完成對(duì)view的數(shù)據(jù)綁定

3猪勇,MVVM:

Model-View-ViewModel

model:模型中包含了代表當(dāng)前的應(yīng)用數(shù)據(jù),

view :視圖顯示了這些數(shù)據(jù)颠蕴;

controller :控制器管理模型和視圖之間的關(guān)系泣刹;

4,依賴注入:

擁有內(nèi)建的依賴注入子系統(tǒng)犀被,可以幫助開發(fā)人員更容易的開發(fā)椅您,理理解和測(cè)試應(yīng)用

5,指令:

ng-app: 表明一個(gè)angularjs應(yīng)用程序寡键,

ng-init:初始化作用掀泳,變量、對(duì)象西轩、數(shù)組员舵;一般很少使用,都是用一個(gè)控制器來(lái)代替它

ng-model:使用ng-model指令可以把程序數(shù)據(jù)綁定到html中藕畔,實(shí)現(xiàn)model和view的雙向綁定马僻;

表達(dá)式{{}} ?在{{}}中可以寫表達(dá)式;

ng-bind:和{{}}類似注服,ng-bind在angular解析渲染完畢后將數(shù)據(jù)顯示出來(lái)巫玻;

ng-click:定義一個(gè)angularjs單擊事件;

ng-repeat:遍歷數(shù)組集合中的每一個(gè)元素祠汇;

ng-class:預(yù)設(shè)指令,用來(lái)動(dòng)態(tài)自定義dom元素的css className

ng-include:將多個(gè)頁(yè)面的公共不封提取出來(lái)熄诡;

6 過(guò)濾器: ?| 管道符

格式化為貨幣格式:{{price | currency }}? {{price | currency : ‘¥’}}

全部轉(zhuǎn)化為大寫:{{name ?| ?uppercase}} ?

全部轉(zhuǎn)化為小寫:{{name | lowercase}}

限制數(shù)組或字符串串?長(zhǎng)度 {{ arr | limitTo : 2 }}

給數(shù)字添加千位分隔符

{{ 12345 | number }}

{{ 12345 | number : 2 }} 保留留2位小數(shù)

排序

ages | orderBy: 'age' : false 升序

ages | orderBy: 'age' : true 降序

ages | orderBy: 'age'

ages | orderBy 數(shù)組升序

ages | orderBy: order: true 數(shù)組降序

7 控制器:

AngularJS程序被控制器?控制

var app = angular.module(“myApp”, []); 獲取應(yīng)用程序

app.controller(“myCtrl”, function ($scope) {}); 控制器?設(shè)置

$scope 用來(lái)保存AngularJS Model的對(duì)象

設(shè)置值

添加變量量

添加函數(shù)

8 內(nèi)置服務(wù) :

AngularJS提供了了一些功能的封裝可很,但是使用方法和之前的庫(kù)不不太一樣

在AngularJS中是以一個(gè)參數(shù)的形式傳遞到控制器?中,在controller中去使?用

有關(guān)定時(shí)器?

$timeout

$timeout(function () {

console.log("haha");

}, 2000);

$interval

$interval(function () {

console.log("hehe");

}, 200);

和JS定時(shí)器?區(qū)別

返回值 id || promies

取消方式

$timeout.cancel();

$interval.cancel();

內(nèi)部實(shí)現(xiàn)封裝了了特殊內(nèi)容

$location absUrl() 獲取地址

$http 發(fā)起網(wǎng)絡(luò)請(qǐng)求凰浮,獲取數(shù)據(jù)

$http.get(“http://localhost:8888/data.json”).success(function (data) {

console.log(data);

});

9 自定義指令:

通過(guò)內(nèi)置指令為應(yīng)?用添加功能我抠,并且AngularJS允許自定義指令創(chuàng)建指令restrict: "E",

restrict: "A"

restrict: "C"restrict: "M",replace: trueapp.directive("lidazeDirective", function () {return {restrict: ‘A’,template: "

自定義指令哦

"};});templateUrl: ‘home.html’ 設(shè)置自定義指令對(duì)應(yīng)的地址

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末苇本,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子菜拓,更是在濱河造成了極大的恐慌瓣窄,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,682評(píng)論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件纳鼎,死亡現(xiàn)場(chǎng)離奇詭異俺夕,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)贱鄙,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,277評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門劝贸,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人逗宁,你說(shuō)我怎么就攤上這事映九。” “怎么了瞎颗?”我有些...
    開封第一講書人閱讀 165,083評(píng)論 0 355
  • 文/不壞的土叔 我叫張陵件甥,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我哼拔,道長(zhǎng)引有,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,763評(píng)論 1 295
  • 正文 為了忘掉前任管挟,我火速辦了婚禮轿曙,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘僻孝。我一直安慰自己导帝,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,785評(píng)論 6 392
  • 文/花漫 我一把揭開白布穿铆。 她就那樣靜靜地躺著您单,像睡著了一般。 火紅的嫁衣襯著肌膚如雪荞雏。 梳的紋絲不亂的頭發(fā)上虐秦,一...
    開封第一講書人閱讀 51,624評(píng)論 1 305
  • 那天,我揣著相機(jī)與錄音凤优,去河邊找鬼悦陋。 笑死,一個(gè)胖子當(dāng)著我的面吹牛筑辨,可吹牛的內(nèi)容都是我干的俺驶。 我是一名探鬼主播,決...
    沈念sama閱讀 40,358評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼棍辕,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼暮现!你這毒婦竟也來(lái)了还绘?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,261評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤栖袋,失蹤者是張志新(化名)和其女友劉穎拍顷,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體塘幅,經(jīng)...
    沈念sama閱讀 45,722評(píng)論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡昔案,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,900評(píng)論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了晌块。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片爱沟。...
    茶點(diǎn)故事閱讀 40,030評(píng)論 1 350
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖匆背,靈堂內(nèi)的尸體忽然破棺而出呼伸,到底是詐尸還是另有隱情,我是刑警寧澤钝尸,帶...
    沈念sama閱讀 35,737評(píng)論 5 346
  • 正文 年R本政府宣布括享,位于F島的核電站,受9級(jí)特大地震影響珍促,放射性物質(zhì)發(fā)生泄漏铃辖。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,360評(píng)論 3 330
  • 文/蒙蒙 一猪叙、第九天 我趴在偏房一處隱蔽的房頂上張望娇斩。 院中可真熱鬧,春花似錦穴翩、人聲如沸犬第。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,941評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)歉嗓。三九已至,卻和暖如春背蟆,著一層夾襖步出監(jiān)牢的瞬間鉴分,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,057評(píng)論 1 270
  • 我被黑心中介騙來(lái)泰國(guó)打工带膀, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留志珍,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,237評(píng)論 3 371
  • 正文 我出身青樓垛叨,卻偏偏與公主長(zhǎng)得像伦糯,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,976評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容

  • 一舔株、angular介紹 1、angular是Google公司提供的一套基于MVC結(jié)構(gòu)的js開發(fā)工具还棱,其核心功能就是...
    滴滴傲閱讀 531評(píng)論 0 0
  • AngularJS是什么载慈?AngularJs(后面就簡(jiǎn)稱ng了)是一個(gè)用于設(shè)計(jì)動(dòng)態(tài)web應(yīng)用的結(jié)構(gòu)框架。首先珍手,它是...
    200813閱讀 1,607評(píng)論 0 3
  • AngularJS AngularJS概述 介紹 簡(jiǎn)稱:ng Angular是一個(gè)MVC框架 其他前端框架: Vu...
    我愛(ài)開發(fā)閱讀 2,338評(píng)論 0 8
  • ng-model 指令ng-model 指令 綁定 HTML 元素 到應(yīng)用程序數(shù)據(jù)办铡。ng-model 指令也可以:...
    壬萬(wàn)er閱讀 871評(píng)論 0 2
  • 通過(guò)AngularJS仿豆瓣一刻的案例:https://github.com/zhongxiaolian/doub...
    中小戀閱讀 1,759評(píng)論 1 21