ngStorage用法
ngStorage is an angularJS module, it contains two services: $localStorage and $sessionStorage .
usage:
1.include ngStorage.min.js in
your html;
2.then load the module in your appliction by adding it as a dependent module,such as:angular.module("app",["ngStorage"]);;
3.include $localStorage and $sessionStorage as
your contrller params.
example:
<span style="color:#333333;"><!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
<title>ngStorage learning</title>
<meta charset="utf-8"/>
<script type="text/javascript" src="../angular.js"></script>
<script type="text/javascript" src="ngStorage.min.js"></script>
<script type="text/javascript">
var ngModule=angular.module("app",["ngStorage"]);
//---------------------------------------------------
ngModule.controller("sixthCtrl",function($scope,$localStorage,$sessionStorage) {
$scope.$storage = $sessionStorage.$default({
city:{
cityId:"",
cityName:""
},
cinema:{
cityLinkId:"",
cinemaId:"",
cinemaName:""
}
});
$scope.cityList=[
{cityId:001,cityName:"广州"},
{cityId:002,cityName:"西安"},
{cityId:003,cityName:"北京"}
];
$scope.cinemaList=[
{cityLinkId:001,cinemaId:1001,cinemaName:"天娱影城"},
{cityLinkId:001,cinemaId:1021,cinemaName:"UA影城"},
{cityLinkId:002,cinemaId:1002,cinemaName:"恒大影城"},
{cityLinkId:002,cinemaId:1022,cinemaName:"西安影城"},
{cityLinkId:003,cinemaId:1003,cinemaName:"北京影城"}
];
$scope.getCity = function(_city){
$scope.$storage.city = _city;
alert(_city.cityName);
}
$scope.getCinema = function(_cinema){
$scope.$storage.cinema = _cinema;
alert(_cinema.cinemaName);
}
});
</script>
<style type="text/css">
body{padding:10px;}
</style>
</head>
<body>
<div ng-controller="sixthCtrl">
<select ng-options="city.cityName for city in cityList" ng-model="cityOption" ng-change="getCity(cityOption);" >
<option value="">请选择城市</option>
</select>
<select ng-options="cinema.cinemaName for cinema in cinemaList | filter:{cityLinkId:$storage.city.cityId}" ng-model="cinemaOption" ng-change="getCinema(cinemaOption);" >
<option value="">请选择影院</option>
</select>
<p>{{$storage.city.cityName}}||{{$storage.cinema.cinemaName}}</p>
</div>
</body>
</html> </span>声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。
