频道导航

angularJS缓存的管理

2019-11-23 Angularjs 前端之家

前端之家收集整理的这篇文章主要介绍了angularJS缓存的管理，前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。

在Angular里面，services作为单例对象在需要到的时候被创建，只有在应用生命周期结束的时候（关闭浏览器）才会被清除。而controllers在不需要的时候就会被销毁了。

这里指的不会消失是指 services原始保留的数据和方法

例：

@H_404_12@ @H_404_12@ var module = angular.module( "my.module",[] );

@H_404_12@ module.service( 'Book',[ '$rootScope',function( $rootScope ) {

@H_404_12@ var service = {

@H_404_12@ books:[

@H_404_12@ { title: "Magician",author: "Raymond E. Feist" },

@H_404_12@

@H_404_12@ { title: "The Hobbit",author: "J.R.R Tolkien" }

@H_404_12@ ],

@H_404_12@ addBook:function ( book ) { @H_404_12@ service.books.push( book ); @H_404_12@ $rootScope.$broadcast( 'books.update' ); @H_404_12@ } @H_404_12@ } @H_404_12@ return service; @H_404_12@ }]); @H_404_12@ 这个server里的 Book. books里的数据和 addBook 方法刷新是不会消失的 @H_404_12@
@H_404_12@ 接着我们定义一个指令往 book.books里添加一些数据 @H_404_12@ @H_404_12@ module.directive( "addBookButton",[ 'Book',function( Book ) { @H_404_12@ return { @H_404_12@ restrict: "E,A", @H_404_12@ link: function( scope,element,attrs ) { @H_404_12@ element.bind( "click",function() { @H_404_12@ Book.addBook( { title: "Star Wars",author: "George Lucas" } ); @H_404_12@ @H_404_12@ }); @H_404_12@ } @H_404_12@ } @H_404_12@ }]); <div add-book-button>点击新增</div>
点击新增时在 Book.addBook里增加了 { title: "Star Wars",author: "George Lucas" } @H_404_12@ 用ng-controller 可以循环读取数据可以读出来，但这时候刷新页面 server只会保留原来的 Book. books里的数据和 addBook 方法新增的数据不会保存