Angular權威指南學習筆記

2022-02-04 14:59:43 字數 4381 閱讀 3468

第一章.初識angular——angular是mvw的js框架。

第二章.資料繫結——viewmodel中不僅可以含有變數,還可以還有事件。可以通過事件來控制變數的值改變。檢視繫結著vm中的變數和事件。

第三章.模組——可以使用angular.module()來宣告模組。

第四章.        作用域——作用:監聽變化,通知變化,隔離資料,提供環境。

$scope的生命週期:

建立:當建立控制器和指令時。通過$inject建立新的作用域。並在新建控制器和指令執行時傳進去。

更新:每個子作用域會進行髒值檢測。當檢測到變化時,會**指定的函式。

銷毀:不使用的時間,銷毀。

第五章.        控制器——是可以巢狀的,所以作用域包含作用域。demo

第六章.        表示式——手動和自動解析。自動通過$digest.如}。手動可以在控制器中控制,讓表示式不按套路出牌。

$parse用來訪問作用域的資料和函式。

第七章.        過濾器——內建自帶過濾器,自定義過濾器,表單驗證。

內建過濾器的兩種使用方法}和$filter(『lowercase』)(「acb」)

時間過濾器 }2014-09-29 17:04:05

filter 後面可以跟字串,物件,函式

}

,] | filter: }}

4.通過過濾器物件轉成json

var person={};

person.age=12;

person.name="hehe";

var p=$filter('json')(person);

5.limitto擷取字串,正從頭開始負從尾開始。

6.number 保留n位小數

7.orderby下面的例子不僅給出了如何按物件的字段排序還給出了如何使用兩個引數的過濾器。

,,] | orderby:'name':true

}}

8.uppercase lowercase

自定義過濾器:

下面是自定義函式

.filter('capitalize', function

() };

}).controller('mycontroller',function

(){});

引用方式

}

7.2表單

可以驗證的input選項:required, ng-minlength, ng-pattern, name="email",type="number",自定義.

表單中控制變數formname.inputfieldname.propertyy.

1.未修改:formname.inputfieldname.$pristine

2.修改過:formname.inputfieldname.$dirty

3.合法表單:formname.inputfieldname.$valid

4.不合法表單:formname.inputfieldname.$invalid

5.錯誤:formname.inputfieldname.$error

以上對應的css

.ng-pristine {}

.ng-dirty {}

.ng-valid {}

.ng-invalid {}

$parsers通常配合指令來用。當ngmodelcontroller中的$setviewvalue()方法時。會逐個呼叫$parser.

demo:

.directive('onetoten', function() else

$formatters

當繫結的ngmodel值發生了變化,並經過$parsers陣列中解析器的處理後,這個值會被傳遞給$formatters流水線

demo

.directive('onetoten', function() );

} };

});7.3下面是關於表單驗證的常見例子:

1.非同步驗證

在失焦後顯示驗證資訊

() );

}).bind('blur', function

(evt) );

});}

};}]);

如果使用1.3可以使用ngmessage.

1.指令通過關鍵字directive來定義。引數1.名字,引數2函式(返回值是個物件)。

2.向指令傳遞資料,建立隔離作用域指令物件有個scope變數。

1.使用ng-include時angularjs會自動建立乙個子作用域

2.ng-switch          when on配合使用。

switch on="person.name">

switch-default>and the winner is

3.ng-class動態設定元素類。

5,blue:x<=5}" >或

10.1.定義:名字和函式(返回值為物件。物件屬性如下)

restrict: string,

priority: number,

terminal: boolean,

template: string or template function:

function

(telement, tattrs) (...},

templateurl: string,

replace: boolean or string,

scope: boolean or object,

transclude: boolean,

controller: string or

function

(scope, element, attrs, transclude, otherinjectables) ,

controlleras: string,

require: string,

link:

function(scope, ielement, iattrs) ,

1.restrict型別

2.priority優先順序 預設為0 越大越先

3.terminal是否停止優先順序比較低的

4.template(字串或函式)

5templateurl(字串或函式)

6replace 是否替換原來的標籤。預設為不替換,即插入。

7.scope

on-send="sendmail(email)"from-name="[email protected]" />

scope:

8.transclude(看不懂用到時再去理解吧)

9.controller(字串或函式)看不懂用到時再去理解吧

10.controlleras(字串)看不懂用到時再去理解吧

11.require(字串或陣列)用到的controller名稱集合。

12.compiled和link互斥,如果兩個都有compiled函式當link的函式使用。

viewvalue通過驗證後才會賦值給modelvalue。

13.ngmodel屬性$viewvalue,$modelvalue,$parsers,$formatters,$viewchangelisteners….form相似的一些屬性$error.$dirty等。

在控制器中定義$render方法可以定義檢視具體的渲染方式。這個方法會在$parser流水線

完成後被呼叫。

Ubuntu權威指南學習筆記

安裝步驟 進入bois介面,設定usb優先啟動,進入ubuntu的安裝介面 一些簡單的前期設定這裡直接忽略,主要說明一下磁碟分割槽。1 至少需要兩個磁碟分割槽,分別用於建立 檔案系統與交換分割槽。其中,linux系統使用交換分割槽提供虛擬記憶體,在乙個32位的pc中,不超過2gb。2 若磁碟儲存空間...

HTTP權威指南學習筆記

一直以為學習前端只需要掌握js語法 html語法 css就夠了,確實沒有想到還需要很多知識點,今天來細細學習http。乙個http請求由4部分組成 伺服器返回的http相應包含3部分 乙個數字和文字組成的狀態碼,用來顯示請求的成功和失敗 乙個響應頭集合 響應主體 最常用的web伺服器是apache和...

css權威指南學習筆記

替換元素 用來替換元素內容的部分並非有文件內容直接表示。元素也是替換元素,單選鈕,核取方塊,文字輸入框。非替換元素 段落,標題,表單元格,列表。除了替換和非替換元素,css2.1還使用另外兩種基本元素型別 塊級元素和行內元素。塊級元素生成乙個元素框,會填充其父元素的內容區,旁邊不能有其他元素。例 行...