iT邦幫忙

DAY 25
8

用 HTML5 和 JavaScript 學習開發 Windows 8 Apps系列 第 24

Day25 Split App 實作官方範例 Blog Reader (2)

  • 分享至 

  • xImage
  •  

今天要修改 data.js,主要是要實做資料的來源,做資料的處理。
本來預設給你的 data.js 都是一些預設的資料跟變數設定,不過在 blog reader 這個範例,會整個大改,我直接把程式碼貼過來,如有任何問題,建議以官方的範例為主。
http://msdn.microsoft.com/en-us/library/windows/apps/hh974582.aspx
哦對了,因為原本預設產生的 data.js 會有很多部分是 blog reader 不會用到的,刪刪減減的,還不如砍掉重練(看個人習慣xdd)。
我先從頭做起,不過這只是 data.js 前面的一部分。

(function () {
    //使用較嚴謹的嚴格模式
    "use strict";

    //定義 dataPromise
    //定義 blogs 變數,主要是用來存 blogs 這個 object  
    //以及其相對應的 key 跟 value 
    var dataPromises = [];
    var blogs;

    //實例化一個 WinJS.Binding.List,主要是要用綁定資料到前台的 ListView
    var blogPosts = new WinJS.Binding.List();
    

    //getFeeds 這個 function
    //會在 blogs 這個 Array 產生好幾筆 Object
    //並且取得每一個 blogs 裡的 Array 的資料
    //會在所有的非同步作業完成之後回傳(return blogs)
    function getFeeds() {
        // blogs儲存的內容,這裡官方好像是列12組,在這裡因為都是重複的形式,因此我先刪成只剩三筆
        blogs = [
        {
            key: "blog1",
            url: 'http://blogs.windows.com/skydrive/b/skydrive/atom.aspx',
            title: 'tbd', updated: 'tbd',
            acquireSyndication: acquireSyndication, dataPromise: null
        },
        {
            key: "blog2",
            url: 'http://blogs.windows.com/windows/b/windowsexperience/atom.aspx',
            title: 'tbd', updated: 'tbd',
            acquireSyndication: acquireSyndication, dataPromise: null
        },
        {
            key: "blog3",
            url: 'http://blogs.windows.com/windows/b/extremewindows/atom.aspx',
            title: 'tbd', updated: 'tbd',
            acquireSyndication: acquireSyndication, dataPromise: null
        }
        ];

        //取得 blogs 裡面的資料
        blogs.forEach(function (feed) {
            feed.dataPromise = feed.acquireSyndication(feed.url);
            dataPromises.push(feed.dataPromise);
        });

        // Return when all asynchronous operations are complete
        return WinJS.Promise.join(dataPromises).then(function () {
            return blogs;
        });


    }
//待續

後面還有很多functuion,待續。。。


上一篇
Day24 Split App 實作官方範例 Blog Reader (1)
下一篇
Day26 Split App 實作官方範例 Blog Reader (3)
系列文
用 HTML5 和 JavaScript 學習開發 Windows 8 Apps30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

2 則留言

0
卡斯
iT邦研究生 1 級 ‧ 2013-10-10 18:47:41

讚

yiying iT邦新手 1 級 ‧ 2013-10-10 22:13:03 檢舉

謝謝

0
SunAllen
iT邦研究生 1 級 ‧ 2013-10-10 22:30:18

沙發沙發

讚!!! 火星文 to 太陽Orz

yiying iT邦新手 1 級 ‧ 2013-10-10 22:32:31 檢舉

呵呵 不好意思汗
我自己也覺得快要火星文了>< 忙

老鷹也覺得老鷹的文章也快變成火星文了Orz

yiying iT邦新手 1 級 ‧ 2013-10-10 23:51:29 檢舉

OrzOrz

我要留言

立即登入留言