【问题标题】:Designing a blog using Angular JS使用 Angular JS 设计博客
【发布时间】:2016-08-02 19:34:26
【问题描述】:

我想设计一个包含几篇文章的博客。在主页中,几个磁贴将​​提供文章的链接,当用户单击带有文章标题的特定磁贴时,他将被重定向到包含该完整文章的新页面。

我知道在这种情况下,制作单页应用程序没有什么帮助。

如果我使用 Angular JS 设计整个网站是否有意义?如果是,如果我想使用 Angular JS 进行设计,我应该如何进行?我应该避免使用路由,因为我已经知道它主要用于 SPA,我应该使用 $location 或其他东西来代替它吗?还是完全放弃使用 Angular JS 进行设计的想法?有没有人使用 Angular JS 设计过多页面应用程序?

您的指导会有所帮助。

【问题讨论】:

    标签: angularjs


    【解决方案1】:

    在确定用于设计应用的语言之前,了解您的应用的用途很重要。在你的情况下,一个博客。

    如果您分析应用程序的功能,以下三项(有/可能更多,但对于这个用例,这三项就足够了)获得突出:

    1. 数据
    2. 用户体验

    1. Flow 表示您可能没有 SPA 而是 MPA,这意味着要考虑制作页面所需的资源、用户体验、博客、用户如果每次点击都会导致向服务器发送一个请求并为用户提供一个繁重的页面供用户阅读,则可能没有所有的承诺(或耐心)来留在博客上。这意味着路由(Express 或 Angular)非常适合在博客中导航用户。

    1. 数据

    博客通常包含文本,用户可能会执行文本搜索,这意味着您需要为您的数据找出正确的数据存储,即文本。

    这将引导您选择最适合且经济的数据库 - SQL Server 提供了全文搜索功能,但成本高昂; MySql 也是如此,而且显然没有或花费更少的成本; MongoDb 是一个文档数据库,它为您提供相同的功能且无需额外费用(除非您选择云模型)。因此,SQL Server 并不理想,因为该应用程序(很可能不是博客)不是为了产生任何利润;如果您使用 PHP 服务器和 PHP 开发,MySQL 是理想的; MongoDb 是理想的,因为它可以使用请求对象包装模型,从而消除读取数据库和写入视图的大量编码。

    例如。

    (在登陆Blog页面的路由器页面中)

    var router = express.Router();
    var posts = mongoose.model('BlogPosts');
    router.get('/get, function(req, res) {
        res.json(req.posts); // As simple as this
    });
    

    (在视图中)

    <div ng-repeat="post in infiniteitems">...</div>
    

    (在控制器中)

    $.ajax({
    url: '<url to your route>',
    type: 'GET',
    dataType: 'json', 
    success: function(data) { 
    $scope.infiniteitems=data; // Binds to the controller item in the view
    $scope.$apply();
    },
    error: function() { },
    beforeSend: setHeader
    });
    

    因此,您只需几行代码即可完成导航、视图和数据。更重要的是,没有 innodb数据库引擎

    代码仅用于说明目的。

    因为 MongoDB 以 JSON 形式返回 document,并且将视图绑定到 JSON 比绑定对象或 XML 值要简单!

    显然,这意味着 MVC 框架,因此 AngularJs 是正确的选择。

    1. UX - Angular Material 与 AngularJS 结合使用时,提供了一些闪烁的设计、颜色和动画,并且简单性增加了性能,增强了 UX 并为视图(对于用户)呈现了不易创建的新鲜感与其他技术。

    所以,选择 Angular。

    而且,由于 MongoDB 与 NodeJS 配合得非常好,整个事情一起工作,这就是为什么他们称它为 MEAN 堆栈 - MongoDB、Express、一个ngularJS,NodeJS!

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2011-10-05
      • 1970-01-01
      • 2016-06-15
      • 1970-01-01
      • 2011-07-10
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多