angularjs緩存數據

㈠ angular js中 http.get方法怎麼用

我們可以使用內置的$http服務直接同外部進行通信。$http服務只是簡單的封裝了瀏覽器原生的XMLHttpRequest對象。

1、鏈式調用
$http服務是只能接受一個參數的函數，這個參數是一個對象，包含了用來生成HTTP請求的
配置內容。這個函數返回一個promise對象，具有success和error兩個方法。

$http({

url:'data.json',

method:'GET'

}).success(function(data,header,config,status){

//響應成功

}).error(function(data,header,config,status){

//處理響應失敗

});
2、返回一個promise對象

var promise=$http({

method:'GET',

url:"data.json"

});
由於$http方法返回一個promise對象，我們可以在響應返回時用then方法來處理回調。如果
使用then方法，會得到一個特殊的參數，它代表了相應對象的成功或失敗信息，還可以接受兩個
可選的函數作為參數。或者可以使用success和error回調代替。

promise.then(function(resp){

//resp是一個響應對象

},function(resp){

//帶有錯誤信息的resp

});
或者這樣：

promise.success(function(data,status,config,headers){

//處理成功的響應

});

promise.error(function(data,status,hedaers,config){

//處理失敗後的響應

});
then()方法與其他兩種方法的主要區別是，它會接收到完整的響應對象，而success()和error()則會對響應對
象進行析構。

3、快捷的get請求

①$http.get('/api/users.json');

get()方法返回HttpPromise對象。

還可以發送比如：delete/head/jsonp/post/put 函數內可接受參數具體參照148頁

②以再發送jsonp請求舉例說明： 為了發送JSONP請求，其中url必須包含JSON_CALLBACK字樣。

jsonp(url,config) 其中config是可選的

var promise=$http.jsonp("/api/users.json?callback=JSON_CALLBACK");

4、也可以將$http當做函數來使用，這時需要傳入一個設置對象，用來說明如何構造XHR對象。

$http({

method:'GET',

url:'/api/users.json',

params:{

'username':'tan'

});

其中設置對象可以包含以下主要的鍵：
①method
可以是：GET/DELETE/HEAD/JSONP/POST/PUT

②url:絕對的或者相對的請求目標
③params(字元串map或者對象)
這個鍵的值是一個字元串map或對象，會被轉換成查詢字元串追加在URL後面。如果值不是字元串，會被JSON序列化。
比如這個：

//參數會轉為？name=ari的形式
$http({
params:{'name':'ari'}
});

④data(字元串或者對象)
這個對象中包含了將會被當作消息體發送給伺服器的數據。通常在發送POST請求時使用。

從AngularJS 1.3開始，它還可以在POST請求里發送二進制數據。要發送一個blob對象，你可以簡單地通過使用data參數來傳遞它。
例如：

var blob=new Blob(['Hello world'],{type:'text/plain'});

$http({

method:'POST',

url:'/',

data:blob

});
4、響應對象

AngularJS傳遞給then（）方法的響應對象包含了四個屬性。
◇data
這個數據代表轉換過後的響應體（如果定義了轉換的話）
◇status
響應的HTTP狀態碼
◇headers
這個函數是頭信息的getter函數，可以接受一個參數，用來獲取對應名字值

例如，用如下代碼獲取X-Auth-ID的值：

$http({

method: 'GET',

url: '/api/users.json'

}).then (resp) {

// 讀取X-Auth-ID

resp.headers('X-Auth-ID');

});
◇config
這個對象是用來生成原始請求的完整設置對象。

◇statusText（字元串）
這個字元串是響應的HTTP狀態文本。

5、緩存HTTP請求
默認情況下，$http服務不會對請求進行本地緩存。在發送單獨的請求時，我們可以通過向$http請求傳入一個布爾值或者一個緩存實例來啟用緩存。
$http.get('/api/users.json',{ cache: true })
.success(function(data) {})
.error(function(data) {});

第一次發送請求時，$http服務會向/api/users.json發送一個GET請求。第二次發送同一個GET請求時，$http服務會從緩存中取回請求的結果，而不會真的發送一個HTTP GET請求。
在這個例子里，由於設置了啟用緩存，AngularJS默認會使用$cacheFactory,這個服務是AngularJS在啟動時自動創建的。

如果想要對AngularJS使用的緩存進行更多的自定義控制，可以向請求傳入一個自定義的緩存實例代替true。

㈡ angularjs可以用c++做後台嗎

為了實現這一點，Angular提供了一個叫做$http的服務。它提供了一個可擴展的抽象方法列表，使得與伺服器的交互更加容易。它支持HTTP、JSONP和CORS方式。它還包含了安全性支持，避免JSON格式的脆弱性和XSRF。它讓你可以輕松地轉換請求和響應數據，甚至還實現了簡單的緩存。例如，我們打算讓購物站點從伺服器上獲取商品信息，而不是從內存假數據獲取。如何編寫服務端代碼已經超越了本書的范疇，所以，我們僅僅來想像一下，比方說我們已經創建了一個伺服器，當查詢/procts路徑時，它會以JSON格式返回一個商品列表。返回的響應示例如下：[{"id":0,"title":"Paintpots","description":"Potsfullofpaint","price":3.95},{"id":1,"title":"Polkadots","description":"Dotswiththatpolkagroove","price":12.95},{"id":2,"title":"Pebbles","description":"Justlittlerocks,really","price":6.95}etc]我們可以像下面這樣編寫查詢代碼：functionShoppingController($scope,$http){$http.get('/procts').success(function(data,status,headers,config){$scope.items=data;});}然後在模板中這樣使用它：Shop!{{item.title}}{{item.description}}{{item.price|currency}}正如我們前面講過的，從長遠來看，讓服務來代理與伺服器交互的工作對我們有好處，這個服務可以被多個控制器共享。

㈢ 如何解決AngularJs在IE下取數據總是緩存的問題

如果用AngularJs在IE下發出GET請求從後台服務取完Json數據再綁定到頁面上顯示的話，你可能會發現就算數據更新了，IE還是會顯示原來的結果。實際上這時候IE的確是緩存了hashtag，沒有再次去做HttpGET請求最新的數據。x0dx0a最直接的辦法是在後台擼掉OutputCache，但這種做法並不推薦，需要改每一處被Angular調用的地方，代價太大。這種問題應該在前端解決最好。研究了一會兒總結了最有效的解決方法，並不需要改後台代碼了。x0dx0a在你的appconfig里擼一個$httpProvider進去，比如像我這樣，和路由可以配在一起，當然分開配也沒問題。x0dx0avarconfig=["$routeProvider","$httpProvider",function($routeProvider,$httpProvider){x0dx0a//(!$httpProvider.defaults.headers.get){x0dx0a$httpProvider.defaults.headers.get={};x0dx0a}x0dx0a//EnablesRequest.IsAjaxRequest()inASP.NETMVCx0dx0a$httpProvider.defaults.headers.common["X-Requested-With"]='XMLHttpRequest'x0dx0a//$httpProvider.defaults.headers.get['Cache-Control']='no-cache'x0dx0a$httpProvider.defaults.headers.get['Pragma']='no-cache'x0dx0a$routeProvider.when("/",{templateUrl:"Manage/dashboard/index.cshtml"})x0dx0a.when("/dashboard",{templateUrl:"Manage/dashboard/index.cshtml"})x0dx0a.when("/dashboard/serverinfo",{templateUrl:"Manage/dashboard/serverinfo.cshtml"})x0dx0a.when("/dashboard/emaillogs",{templateUrl:"Manage/dashboard/emaillogs.cshtml"})x0dx0a//othercode....x0dx0a.otherwise({redirectTo:"/"});x0dx0a}];x0dx0aapp.config(config);x0dx0ax0dx0a最關鍵的就是最後的禁用IE對ajax的緩存x0dx0a$httpProvider.defaults.headers.get['Cache-Control']='no-cache'x0dx0a$httpProvider.defaults.headers.get['Pragma']='no-cache'x0dx0ax0dx0a如果你想這樣寫，是會爆的：x0dx0a$httpProvider.defaults.headers.get['If-Modified-Since']=Ɔ'x0dx0ax0dx0a這樣會導致include指令載入的partialview擼不出來，所以不要作死了

㈣ AngularJS展示數據的ng-bind指令和{{}}的區別

在AngularJS中顯示模型中的數據有兩種方式：

一種是使用花括弧插值的方式：

另一種是使用基於屬性的指令，叫做ng-bind

這兩種方式的效果是一樣的，主要的區別在於：

使用花括弧語法的時候，在AngularJS使用數據模板中的花括弧時，第一個載入的頁面，通常是應用中的index.html, 其未被渲染的模板可能會被用戶看到

使用ng-bind的方法時就不會遇到這樣的情況

遇到這種情況的原因是：

瀏覽器需要首先載入index.html頁面，渲染他，然後AngularJS才能把它解析成你期望的內容。所以，對於Index.html頁面的數據綁定操作，建議採用ng-bind。那麼在數據載入完成之前用戶就不會看到任何內容。

㈤ angularjs路由如何禁止緩存

angular默認的模板載入都會被緩存起來，使用的緩存服務是$tempalteCache，發送模板請求的服務是$templateRequest，可以有兩種方案：
1.每次發送$http請求模板完成後，調用$tempalteCache.remove(url)或removeAll清除所有模板緩存；
2.使用$provide.decorator改寫原生的$templateRequest，禁掉緩存，$templateRequest的源碼，可以看到它默認使用$tempalteCache作為緩存，可以去掉它。

㈥ 如何解決AngularJs在IE下取數據總是緩存的問題

ngApp.config(function($httpProvider){
//Initializegetifnotthere
if(!$httpProvider.defaults.headers.get){
$httpProvider.defaults.headers.get={};
}

//EnablesRequest.IsAjaxRequest()inASP.NETMVC
$httpProvider.defaults.headers.common["X-Requested-With"]='XMLHttpRequest';

//禁用IE對ajax的緩存
$httpProvider.defaults.headers.get['Cache-Control']='no-cache';
$httpProvider.defaults.headers.get['Pragma']='no-cache';
});

可以在AngularJS的配置中通過$httpProvider來設置其不緩存。

㈦ AngularJS如何判斷緩存里是否有用戶來進行登錄或注銷

首先你要有存用戶數據的能力才能判斷數據是否存進去了是吧，js中有一個localStorage的方法用來讓電腦手機中存數據，具體的你自己網路，我下面貼一些我自己用的代碼給你看看吧

這個是local.js文件，需要在app.js中依賴注入Local

用get獲取我在注冊登陸的時候存在本地的賬號密碼

㈧ AngularJS如何判斷緩存里是否有用戶來進行登錄或注銷

1、插件源碼主要基於angular directive來實現。 2、調用時關鍵地方是後台請求處理函數，也就是從後台取數據 3、插件有兩個關鍵參數currentPage、itemsPerPage，當前頁碼和每頁的記錄數。 4、實現方法調用後我們需要根據每次點擊分頁插件頁碼時重新提交後台來獲取相應頁碼數據。 在調用的頁碼中我使用了$watch來監控。 我初次使用時是把調用函數放在了插件的onchange中，結果發現每次都會觸發兩次後台。這個地方需要注意。 5、我把請求後台封裝成了Service層，然後在Controller里調用，也符合MVC思想。

㈨ angularJs ui-router路由之多視圖實現菜單緩存切換

**

**
一個模板中存在多個ui-view,每個ui-view都存在唯一的名稱作為標識，通過v-show來判斷當前的ui-view是否顯示，實現如下圖效果

以上可以實現基本的菜單切換，但是需要注意的是：
1.每個頁面模塊的controller的命名不能相同，否則會出現調用方法的混亂，可能會進入到另一個同名的controller中調用方法；
2.當使用此方法對頁面進行緩存，如果打開多個模塊用到websocket接受伺服器消息時，不能使用WebSocket.onmessage監聽和接受伺服器消息，否則可能會調用其他controller中WebSocket.onmessage，當前的頁面模塊就會監聽不到伺服器消息，這時我們可以使用
socket.addEventListener('message', function (event) {
console.log('Message from server ', event.data);
});
進行伺服器消息的監聽，並在方法體內做判斷，是否是當前頁面需要的。
3.如果某個頁面的彈出框用到了路由調用則彈框中的頁面不會顯示，所以建議不要在彈框中直接調用路由載入頁面，或者可以在index.jsp中：

4.如果幾個模塊views裡面的name一樣，則會出現載入的頁面重復的問題；
5.style樣式：如果多個模塊存在相同名稱的選擇器，則樣式會沖突；
還有些問題會在後面慢慢補充。
6.頁面打開太多會出現卡頓現象
7.一定要引入 <script src="vendor/angular/angular-ui-router-ext/ct-ui-router-extras.min.js"></script> ，否則會出現ui-view沒有緩存的情況