MVC????后臺
M Module 數據層
V View 視圖層
C Controller 控制層
前端開始用MVC
M 數據層 交互
V 視圖層 DOM操作
C 控制層 邏輯
不用原生寫MVC
????1.不是所有人都懂MVC,用人需求變高。
????2.風格不統一
庫和框架的區別?
庫 輔助程序員開發 JQuery
框架 限制程序員開發 Angular
AngularJS
????MVVM的框架
????Angular火。有人在推,Google
????用的人少了,自己作。更新。
????????主版本.次版本.修訂號
1.2.x
玩法直接變了
1.3.x
javascript
2.x
TypeScript
????本質還是MVC,只不過衍生出很多叫法
????????MVC
????????MVVM
????????MVP
????????MV*
????面向過程
????面向對象
????面向數據
????致力于解決所有交互所帶來的痛苦。
????????只需要關心數據就行。
????官網:https://angularjs.org/
????下載:https://code.angularjs.org/
????文檔:https://code.angularjs.org/1.5.8/docs/api
Function????????Angular提供的方法
angular.bind 矯正this
angular.bootstrap 開啟angular應用
angular.copy 復制對象
angular.element 小jquery
angular.equals 比較是否相等
angular.forEach 迭代
angular.fromJson
angular.isArray 檢測是否是數組
angular.module angular模塊
????玩的就是數據——數據就是一切
ng-app 哪是angular管的
一個頁面只能加一個
ng-model 數據源
ng-bind 數據綁定
ng-bind平時用的少。
用:{{}}
angular的核心:
????依賴注入、雙向綁定
Directive????指令
ng-app
ng-model
ng-bind
ng-init 初始化
ng-click 點擊
ng-repeat 迭代
{{$index}} 索引
{{$first}} 是否是第一行
{{$last}} 是否是最后一樣
{{$even}} 是否是奇數行
{{$odd}} 是否是偶數行
????數組有重復會有問題:
????????原因:默認把值當成索引了。
????解決:
????????ng-repeat="item in arr track by $index"
ng-show 顯示
ng-hide 隱藏
ng-if 如果是真的就顯示,否則就已隱藏
ng-controller 控制器
????環境:
????????原生環境
????????NG環境
Controller????????控制器
let app = angular.module('名字',[依賴]);
app.controller('控制名字',($scope)=>{
$scope 當前控制器的域
});
Filter????????過濾器
{{item.price|currency}}
currency 貨幣
{{item.price|currency:'¥'}}
date 日期
filter 過濾器
limitTo 限制數量
number 1004354548
Angular的問題
????數據變了,但是DOM沒有渲染
????解決:
????????臟檢查
Service???????? 服務
????$interval ???? 定時器
????$timeout ???? 定時器
交互
$http服務
GET
$http.get('url',{
params:{
參數
}
}).then((res)=>{
res.data 數據
},(err)=>{
});
POST
$http({
method:'POST',
url:'',
data:{
參數
},
headers:{
'Content-Type':'application/x-www-form-urlencoded'
},
transformRequest:function(data){
var arr = [];
for(var key in data){
arr.push(key+'='+data[key]);
}
return arr.join('&');
}
}).then((res)=>{
res.data 數據
},(err)=>{
});