今天完成的事情：

预估学渣乐园项目中可能遇到的问题，查找相关资料，将解决办法写入方案中；

重新看wiki上开发流程和规范,复盘项目时用angular没注意的内容，学习一波;

1.尽可能使用$resource 而非$http。更高的抽象避免冗余

控制器

需要跨控制器通讯时，通过方法引用或者$emit,$broadcast,$on方法。发送和广播消息应该限定在最小作用域

指令

 处理不可信的数据时，使用$sce

sce”指的是“Strict Contextual Escaping”，它是默认开启的，负责拒绝一些不安全的行为，比如加载不同源的资源等等。但是有时候，我们又需要加载一些特定的资源，我们就得使用$sce的一些方法，来为这些资源和AngularJS系统之间建立信任。常用方法：

$sce.trustAs(type,name);//type可选值：$sce.HTML、$sce.CSS、$sce.URL（a标签中的href ， img标签中的src)、$sce.RESOURCE_URL（ng-include,src或者ngSrc，比如iframe或者Object）、$sce.JS

$sce.trustAsHtml(value); //将一段html文本视为安全

$sce.trustAsUrl(value); //

$sce.trustAsResourceUrl(value);

$sce.trustAsJs(value);

蓝色部分基于红色部分api使用的;如渲染一段html文本:

<div ng-controller="LogController">
    <!--这里不能用ng-bind，因为是渲染一段html文本，而不是显示简单的数据-->
    <div ng-bind-html="results"></div>
</div>

angular.module('myDemo', [])
    .controller('LogController', function ($scope, $http, $sce) {
        // 随便定义一段html文本
        var txt = "<h1>Hello world!</h1>";
        // 这里不能直接$scope.results = txt，否则会报错显示“不安全”
        $scope.results = $sce.trustAsHtml(txt);
    });

‍‍‍‍过滤器

‍‍ 过滤器中只做一件事，更复杂的操作可以用pipe串联多个过滤器‍‍‍‍‍‍

有时为了方便，将所有过滤动作都集在了一个filter中，当需要用其中某个过滤功能时就感觉画蛇添足了；

 服务

 使用$cacheFactory进行回话级别的缓存，缓存网络请求或复杂运算的结果

ng模块中的服务

以工厂模式构造cache对象，并且使它们可以被访问。

$cacheFoctory：用于生成一个用来存储缓存对象的服务，并且提供对对象的访问。

$cacheFactory.Cache：一个用于存储和检索数据的缓存对象。主要使用$http和脚本指令来缓存模板和其他数据。用法：

$cacheFactory(cacheId, [obj]);

PS:这是应用程序的缓存服务，而不是浏览器本地的缓存。所以刷新浏览器，初始化整个应用程序的时候，之前的缓存数据都会丢失。之前有用factory写过暂存对象的服务，通过set和get进行存取，应用的是这个思想。

模板

使用ng-bind或者ng-cloak而非简单的{{}}以防止页面渲染的闪烁。‍‍

刚接触angualr的时候就找了相关的资料，关于ng-bing和{{}}的区别，{{}}会在DOM加载未渲染时出现，ng-bind则不会，但{{}}会相对灵活些，可以直接进行变量拼接，ng-bind以标签为载体还是有些麻烦，所以图方便一直用{{}}，偶尔想起采用ng-bind，体验上来说ng-bind更好；

‍‍ng-cloak:

‍‍在用angularJS框架开发中,页面加载时会看到有表达式{{express}}或者过滤器{{express | filter}}在页面中闪过。这个问题是由于javascript操作DOM的时候，是等DOM结构都加载完成，才回头处理引用的angularJS文件。这是引起表达式或过滤器在页面闪烁的原因。这时，只需要在需要的地方加上ng-cloak即可；‍‍

过程：

页面初始化时在DOM的heade增加一行CSS代码，如下

<pre class= “prettyprint linenums”>
      [ng\:cloak],[ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak{
         Display:none ! important;
     }
</pre>

Angular将带有ng-cloak的元素设置为display：none.

在等到angular解析到带有ng-cloak节点的时候，会把元素上ng-cloak  attribute和calss同时remove掉，这样就防止了节点的闪烁。

明天计划：

完成学渣乐园前端技术方案；

困惑：

关于如何调用相机、本地相册以及微信用户资料？

查看微信JS-SDK说明文档了解其开放API，引入jweixin-1.0.0.js文件，在页面调用；

收获

如上