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没有缓存的情况