<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script src="jquery-1.9.1.min.js"></script>
</head>
<body>
<div ng-app="hd" ng-controller="ctrl">
设置:{{data}}
<br/>
获取:{{get.city}}
<br/><br/><br/><br/><br/>
<form method="post" action="">
商品:<input type="text" ng-model="goods.name"/><br/>
价格:<input type="text" ng-model="goods.price"/><br/>
<textarea name="goods"></textarea>
<input type="submit" />
</form>
</div>

<script>
var m=angular.module("hd",[]);
m.controller("ctrl",['$scope',function($scope){
$scope.data={'city':'xiamen'};
localStorage.setItem('data',angular.toJson($scope.data));//设置
$scope.get=angular.fromJson(localStorage.getItem('data'));//获取

$scope.goods={'name':'apple','price':10};
$('form').submit(function(){
$("[name='goods']").val(angular.toJson($scope.goods));//转化成字符串才会显示
return false;
});

}]);

</script>
</body>
</html>

angular笔记_7的更多相关文章

  1. angular笔记

    /** * Created by Administrator on 2016/5/3 0003. */ ng-app是告诉angularjs编译器把该元素当作编译的根 //定义模块 var myApp ...

  2. Angular笔记-select

    --select-- 设置默认选中值方法: <select ng-model="url" ng-options="x.url as x.site for x in ...

  3. angular笔记_6

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  4. angular笔记_5(全选/反选)

    全选和反选 BUG:当鼠标点击其中一个选项后,在点击全选按钮,该选项失效 <!DOCTYPE html><html lang="en"><head&g ...

  5. angular笔记_4(函数)

    angular.isString();是否字符串 angular.isNumber();是否数字 angular.isArray();是否数组 angular.isDate();是否日期/时间 ang ...

  6. angular笔记_3

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  7. angular笔记_2

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  8. angular笔记_1

    第一个angular文件<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js&q ...

  9. Angular 笔记系列(二)数据绑定

    数据绑定这块儿没啥说的,简单两个例子带过了. Hello World: <!DOCTYPE html> <html ng-app> <head> <title ...

随机推荐

  1. Cpython支持的进程与线程

    一.multiprocessing模块介绍 python中的多线程无法利用CPU资源,在python中大部分情况使用多进程.python中提供了非常好的多进程包multiprocessing. mul ...

  2. java 命令行运行时报错:找不到或无法加载主类

    源码如下: 路径目录(...\src\object) //: ch1.10/Command.java /**@author feilong * @version 1.0 */ package obje ...

  3. 使用gulp进行代码压缩

    gulp是一个很不错的前端自动化工具,可以帮我们完成一些重复性操作,比如html.css和js代码的压缩.合并.混淆等,虽然这些操作可以通过一些在线工具帮我们实现,但不断重复地复制粘贴肯定比不上一句命 ...

  4. Nginx详解二十六:Nginx架构篇之性能优化

    一.性能优化考虑点 1.当前系统结构瓶颈 通过压力测试观察指标.日志检测.性能分析 2.了解业务模式 接口业务类型.系统层次化结构 3.性能与安全 二.ab接口压力测试工具 1.安装:yum -y i ...

  5. java 多线程中的锁的类别及使用

    目前在Java中存在两种锁机制: synchronized Lock Lock接口及其实现类是JDK5增加的内容,其作者是大名鼎鼎的并发专家Doug Lea. 数据同步需要依赖锁,那锁的同步又依赖谁? ...

  6. Spring Boot 导出Excel表格

    Spring Boot 导出Excel表格 添加支持 <!--添加导入/出表格依赖--> <dependency> <groupId>org.apache.poi& ...

  7. 阻止Java反编译蛋疼方法

    public class landv { private static String companyName="landv测试"; public static void main( ...

  8. Nginx限制下载速度

    http {   limit_conn_zone $binary_remote_addr zone=one:10m; #容器共使用10M的内存来对于IP传输开销 server {        lis ...

  9. Windows10右键添加“在此处打开命令窗口”

    cmdHere.reg: Windows Registry Editor Version 5.00 [HKEY_CLASSES_ROOT\Directory\shell\OpenCmdHere] @= ...

  10. Aho-Corasick算法实现(简单关键字过滤)

    using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace Cons ...