下载所有的源码和mongoose web服务器 – 538.1 KB
------------------------------------------分割线------------------------------------------
具体下载目录在 /2014年资料/9月/20日/使用 AngularJS 创建的 RSS 阅读器 —— FreedReadR
------------------------------------------分割线------------------------------------------
简介
几年前，我用C#写了一个RSS阅读器，但是我想如果把它做成一个SPA（单页应用）效果会更好。 Angular使一些事情变得简单，RSS阅读器就是其中之一。 我也用Twitter Bootstrap（做UI）实现了RSS阅读器，调试页面样式是最难的地方之一...可能是因为我不擅长css的原因。
背景
我有一些自己喜欢的网站（ CodeProject, Dr.Dobb's Journal, ComputerWorld, Inc. Magazine）。 然而，我发现其中很多网站都有烦人的广告、风格不好的布局，我实在不愿意看到这些东西。当我说这话的时候，并不包括 CodeProject网站。
在这些网站之间来回切换浪费了很多时间。 因此我更喜欢浏览文章标题和简介，这样我可以决定是否进入文章内容页面。 这就是我决定写FreedReadR 单页应用的原因。
FreedReadR 响应是比较快的，因为它读取的数据量（RSS源）比较小。
下面是点击CodeProject选项的效果图：
下面是FreedReadR 加载某一个站点数据的效果图：
你现在可以试下效果：
差点忘了，我在创建自己的RSS 阅读器之前在Google上搜索了这个想法，发现jsfiddle中一段比较好的代码： angularJS Feed Reader alt.
我的代码和它的代码有相似的地方，但仍有不同，因为我想要实现更多的功能。 FreedReadR 允许你本地存储自己的RSS源数据，这样你就可以一直使用应用来创建自定义的RSS源。 另外，它的代码基于Twitter Bootstrap 2，FreedReadR 基于新版本Twitter Bootstrap 3。
希望你喜欢，并分享我的工作~带你走近AngularJS系列：
在 AngularJS 应用中通过 JSON 文件来设置状态
AngularJS 之 Factory vs Service vs Provider
AngularJS —— 使用 ngResource、RESTful APIs 和 Spring MVC 框架提交数据
使用代码
如果你熟悉Angular，开发时代码并不多。 大部分的难点是在Angular中使用Bootstrap。
其它问题可以在”Angular编程思想”中找到解决方法。$scope 的用法和控制器工作的方式有点不同。 首先你必须在html中设置应用程序的作用域。 类似下面的使用ng-app="FreedReadR"的代码，设置了html中$scope的作用域：所有div标签内的对象 –- 在下面的示例中作用域是整个页面。 我只需要一个控制器来处理整个应用程序逻辑，我对这一点比较满意。
<body ng-app="FreedReadR">
<div data-ng-controller="FeedCtrl">
<h4>RSS Feed Reader using AngularJS</h4>
<form class="form-horizontal col-md-12" role="form">
<div class = "row">
<div class="col-md-6">
在上面的html代码中，你可以看到Angular 应用模板的名称是FreedReadR。 当我设置应用程序模板、添加控制器(FeedCtrl) 代码时，我在main.js文件中使用了相同的名字。让我们看一下main.js中设置参数的代码。
var app = angular.module('FreedReadR', []);
app.factory('FeedService',function($http){
return {
parseFeed : function(url){