国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

使用 AVOS Cloud JavaScript SDK 和 AngularJS 創建 一個 Tod

MkkHou / 1420人閱讀

摘要:注意并不是一個的值組合,比如有方法,所以不能這樣獲取屬性。需要創建一個自己的應用,并在初始化的時候替換掉里的。關于通知發生變化除了通過,還可以借助或者。

為什么選擇這兩個庫做 Todo

AVOS Cloud JavaScript SDK 負責把數據存儲在服務器,提供了 數據查詢,保存,更新等常用操作的方法。AngularJS 對于增刪改查類型的應用場景非常合適。這塊主要用到了 AngularJS的 模板和綁定方面的特性。

Step By Step 入門

這里主要說下 AVOS cloud Javascript SDK 與 AngularJS 結合使用的部分

初始化 AVOS Cloud JavaScript SDK
AV.initialize("your app id", "your app key");

既然是與 AngularJS,這里可以有更優雅的寫法,對于angular 來說初始化可以放在 模塊初始化的配置里面。

var module = angular.module("todoMod",[]);
    module.run(function() {
        AV.initialize("your app id", "your app key");
    });
保存一個對象
        var Todo = AV.Object.extend("Todo");
        var todo = new Todo();
        todo.set("text",$scope.newTodo.text);
        todo.set("done",$scope.newTodo.done)
        todo.save(null, {
            success: function(result){
                $scope.$apply(function(){//使 angular 知道數據發生了變化
                    $scope.todos.push(todo.toJSON());
                });
            }
        });

我們知道一個 AngularJs 的model是一個 plain JavaScript Object,對于 AV Object, 需要用 set來設置屬性。注意 AV Object并不是一個 key,value的值組合,比如有 todo.save()方法,所以不能 todo[prop]這樣獲取屬性。需要走setter,getter方式。還有其他更優雅的結合方式 下面再說。

這里還有一點需要注意,就是 $scope.$apply 這一行,因為數據的保存請求是通過AV Object 進行的,所以angular 并不知道發送了什么,需要告知angular todo數據發生了變化。

todo.toJSON()todo 是一個 AVObject 類型實例,需要轉換成 angular 需要的數據格式。

查詢 Todo 列表
        var Todo = AV.Object.extend("Todo");
        var query = new AV.Query(Todo);
        query.find({
            success:function (results){
                $scope.$apply(function(){
                    $scope.todos = JSON.parse(JSON.stringify(results));;
                })
            }
        })

這里需要注意 JSON.parse(JSON.stringify(results)), results 是一個普通的 js Array,但里面的元素都是 AVObject 類型的實例,需要轉化成 angular需要的數據格式。

一個簡單的模型就建立起來了

查看源碼 ,下載下來直接打開 index.html 就可以看到效果了。

通過 AVOS Cloud 數據管理平臺查看,管理數據。需要創建一個自己的 應用,并在初始化的時候 替換掉 AV.initialize 里的 AppId AppKey

關于 AV Object 數據與 Angular的轉化。

除了通過JSON方式,還可以用

Object.defineProperty(Todo.prototype, "title", {
      get: function() {
        return this.get("text");
      },
      set: function(aValue) {
        this.set("text", aValue);
      }
    });

這樣可以在 html 里直接通過 {{todo.text}} 訪問。

關于通知 Angular 發生變化

除了通過 $scope.$apply,還可以借助 $timeout 或者 $promise

var defer = $q.defer();
        var query = new AV.Query(Todo);
        query.find({
          success : function(results) {
            defer.resolve(results);
          },
          error : function(aError) {
            defer.reject(aError);
          }
        });

        return defer.promise;

結合 AVOS Cloud JS SDK 和 AngularJS 可以實現 MEAN 的全棧開發。其中 M(Mongo) E(Express) N(node) 由 AVOS Cloud 完成。

文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/87565.html

相關文章

發表評論

0條評論

MkkHou

|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<