Question

我愿意启动一个Web应用程序，我想用于客户端angular.js，bootstrap并进一步添加DeployD。

但我对角度项目有一个问题：我找不到任何具有基本MVC骨架的启动项目。

（有人问这个，但没有具体答案：Angularjs MVC skeleton project with user management）

顺便说一下，我是一个与角度和使用包控制器相关的初学者。我发现了一些带角度的git-sources但是没有MVC或者有太多的东西我希望我不会用。

帮助？

Answer 1

我建议您查看Yeoman来帮助您构建项目。基本上，它是构建在NodeJS之上的工具，可让您使用不同的生成器创建项目样板。为各种图书馆编写了大量的生成器。由于您使用的是AngularJS，我建议您查看此AngularJS Generator。

安装Yeoman和生成器引导后，您的应用程序就像运行

一样简单

mkdir my-new-project && cd $_
yo angular [app-name]

还有其他生成器也会添加Twitter Bootstrap或其他库，但您可以使用Bower轻松解决这个问题。

现在，我并不完全明白你对MVC骨架的意思。 AngularJS并不像MVC框架那样真实。它有自己的做事方式，如果你真的想要从图书馆中获得最大的收益，你应该真的按照自己的方式行事。例如，用于保存数据的 Model 的概念并不作为核心组件存在。

也就是说，你可以用AngularJS的行为类似于MVC或至少MV * app来实现。例如，AngularJS有一个名为 factory 的组件，它基本上是一个单例对象，您可以在该应用程序的其他组件上注入以共享行为。如果您需要有关工厂的更多信息，可以查看this StackOverflow thread。使用 factory ，您可以构建自己的模型。更好的是，如果您希望模型与RESTful API通信，则可以使用AngularJS $resource service。

以下是如何完成此操作的基本示例：

// We are assuimng that our AngularJS app resides on an "App" global var

App.factory('Model', ['$resource', function($resource){     
    var Model = function(attributes, options){
        this.attributes = attributes;
        this.options    = options;
    };

    Model.prototype.save(key, val, options){
        // Save code goes here
    }

    Model.prototype.set(key, val, options){
        // Set code goes here
    }

    Model.prototype.fetch(options){
        // fetch code goes here
    }

    Model.prototype.destroy(options){
        // destroy code goes here
    }

    var restRoutes =       {
      'create':  { method: 'POST' },
      'index':   { method: 'GET', isArray: true },
      'show':    { method: 'GET', isArray: false },
      'update':  { method: 'PUT' },
      'patch':   { method: 'PATCH' },
      'destroy': { method: 'DELETE' }
    };

    Model.prototype.sync = $resource('/[your_backend_api]/:id',{id: '@_id'}, restRoutes)

    /*
    ** Return
    */
    return Model;
  }]
);

此外，您应该检查此库以将所有内容粘合在一起：Ui-Router。此库使用 States 来控制应用程序的反应方式。在每个状态中，您可以定义模板，它代表视图，控制器和 resolve 对象，它可以管理来自服务器的数据并将其提供给控制器。

希望这有帮助！

Answer 2

我使用bootstrap，jade，gulp和font-awesome创建了一个角度应用程序框架，它也跟随MVC。它可能会帮助你。按照说明运行应用程序 Angular app skeleton

Angular StartUp项目MVC骨架

2 个答案: