ngStorage用法

论坛 期权论坛 脚本     
已经匿名di用户   2022-2-7 16:33   3523   0


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>




分享到 :
0 人收藏
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

积分:81
帖子:4969
精华:0
期权论坛 期权论坛
发布
内容

下载期权论坛手机APP