簡(jiǎn)介

幾年前，我用C#寫了一個(gè)RSS閱讀器，但是我想如果把它做成一個(gè)SPA（單頁應(yīng)用）效果會(huì)更好。 Angular使一些事情變得簡(jiǎn)單，RSS閱讀器就是其中之一。 我也用Twitter Bootstrap（做UI）實(shí)現(xiàn)了RSS閱讀器，調(diào)試頁面樣式是最難的地方之一...可能是因?yàn)槲也簧瞄Lcss的原因。

背景

我有一些自己喜歡的網(wǎng)站（ CodeProject, Dr.Dobb's Journal, ComputerWorld, Inc. Magazine）。 然而，我發(fā)現(xiàn)其中很多網(wǎng)站都有煩人的廣告、風(fēng)格不好的布局，我實(shí)在不愿意看到這些東西。當(dāng)我說這話的時(shí)候，并不包括 CodeProject網(wǎng)站。

在這些網(wǎng)站之間來回切換浪費(fèi)了很多時(shí)間。 因此我更喜歡瀏覽文章標(biāo)題和簡(jiǎn)介，這樣我可以決定是否進(jìn)入文章內(nèi)容頁面。 這就是我決定寫FreedReadR 單頁應(yīng)用的原因。

FreedReadR 響應(yīng)是比較快的，因?yàn)樗x取的數(shù)據(jù)量（RSS源）比較小。

下面是點(diǎn)擊CodeProject選項(xiàng)的效果圖：

下面是FreedReadR 加載某一個(gè)站點(diǎn)數(shù)據(jù)的效果圖：

你現(xiàn)在可以試下效果：

http://newtonsaber.com/FreedReadR

差點(diǎn)忘了，我在創(chuàng)建自己的RSS 閱讀器之前在Google上搜索了這個(gè)想法，發(fā)現(xiàn)jsfiddle中一段比較好的代碼： angularJS Feed Reader alt.

我的代碼和它的代碼有相似的地方，但仍有不同，因?yàn)槲蚁胍獙?shí)現(xiàn)更多的功能。 FreedReadR 允許你本地存儲(chǔ)自己的RSS源數(shù)據(jù)，這樣你就可以一直使用應(yīng)用來創(chuàng)建自定義的RSS源。 另外，它的代碼基于Twitter Bootstrap 2，F(xiàn)reedReadR 基于新版本Twitter Bootstrap 3。
使用代碼

如果你熟悉Angular，開發(fā)時(shí)代碼并不多。 大部分的難點(diǎn)是在Angular中使用Bootstrap。

其它問題可以在”Angular編程思想”中找到解決方法。$scope 的用法和控制器工作的方式有點(diǎn)不同。 首先你必須在html中設(shè)置應(yīng)用程序的作用域。 類似下面的使用ng-app="FreedReadR"的代碼，設(shè)置了html中$scope的作用域：所有div標(biāo)簽內(nèi)的對(duì)象