return $http.jsonp('//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=50&callback=JSON_CALLBACK&q=' + encodeURIComponent(url));
}
}
});
app.controller("FeedCtrl", ['$scope','FeedService', FeedCtrl]);
在上面的js代码中,第一行是创建AngularJS 应用模板。 注意,它的名称是FreedReadR,我们在html代码中使用相同的名称以引用这个模板。
接下来,我们创建一个Angular工厂类,后面会用它访问RSS源URL来获取真实的源数据。 认真地看下代码中使用的 $http.jsonp请求。URL格式如下:
//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=50&callback=JSON_CALLBACK&q=
URL里调用了Google API,以前我并不知道Google API。这就是我在文章开头提到的jsfiddle示例的主要代码。 如果你想更多地了解Google API,你可以在这里下载:https://developers.google.com/feed/v1/jsondevguide。
在上面的js代码中,你会发现我们调用了encodeURIComponent 函数,它是用来转换URL的。
配置Angular 控制器控制器用来处理应用程序的逻辑,因此大部分js函数应该在控制器内部。这就是Angular 帮助你组织(混乱的)js代码的方式。 我刚有大声说出来吗?
好吧,JavaScript鼓励杂乱无章,不是吗?这是它不好的地方.提到JavaScript的全局变量的时候,你不用带着恐惧尖声叫喊着说吗?如果不用,那么我们可能要撤销你的开发者许可证.你有编写软件的许可,不是吗?(译者注:因为你有开发者许可证,所以你自然也是带着恐惧尖声叫喊着说JavaScript的"全局变量"的--这里有些夸张的说法,意在说明开发者对于JavaScript的"全局变量"的使用应该有所顾忌.)
现在,在我们深入了解应用程序具体做了些什��的时候,看看控制器提供的功能.看看在控制器中的每个函数,以便了解FreedReadR可以做些什么.
检查localStorage, 存在则加载我想做的一件事是,希望你在浏览器的slocalStorage中保存你的源.我不希望因为设置数据库而弄得一团糟,但我希望你可以增加自定义的源,并且让他们在你的浏览器中一直可用.
localStorage的限制当然,localStorage的限制是,它存在于一个特定浏览器的给定域名.
这意味着,如果你从NewtonSaber.com/FreedReadR运行应用程序并保存一些自定义的源,当你从浏览器打开最初打开的连接的时候,你将会再次只看到列表中的这些内容.每个浏览器的localStorage都是私有的.所以,如果你某天使用IE增加了一些源,在接下来的一天将无法使用Chrome来查看已经添加的源.
对我来说,这个版本的应用程序已经OK了.因为它是我所希望的,用非常快速和了解其限制的技术开始.修正限制可能是以后另一篇文章的事情了.
你会发现在控制器代码中,我首先调用了一个函数:retrieveFromLocalStorage()。
函数如下:
function retrieveFromLocalStorage()
{
$scope.allFeeds = [];
console.log("retrieving localStorage...");
try
{
$scope.allFeeds = JSON.parse(localStorage["feeds"]);
console.log($scope.allFeeds.length);
// console.log(JSON.stringify($scope.allFeeds));
if ($scope.allFeeds === null)
{
console.log("couldn't retrieve feeds" );
loadDefaultFeeds();
}
}
catch (ex)
{
console.log("ex: " + ex);
loadDefaultFeeds();
saveToLocalStorage($scope.allFeeds);
}
}
这是一个非常简单的函数。 它在 $scope的作用域内定义了一个名为 allFeeds的数组变量。 然后,通过 JSON.parse方法从localStorage数组中读取一个 feeds对象,这个对象保存的是已存在的 RSS源。如果这个 feeds对象为 undefined(这是首次运行应用程序),程序会抛出一个异常。 当异常被抛出时,应用程序会加载一些默认的 RSS源(loadDefaultFeeds()),然后将这些源保存到localStorage中供下次使用。