AngularJS中基于对象的应用程序结构的关键视图

时间:2013-07-24 09:17:44

标签: javascript oop angularjs architecture

在过去的几周里,我试图学习一些Angular,我采用了某种应用程序架构。

假设有一个中间大型SPA,我创建视图并应用一个主控制器:

<html ng-app="app">
    <body ng-controller="appCtrl">
        <!-- All of the view goes in here -->
    </body>
</html>

现在我想一想我的应用程序必须要做的事情。假设这个人必须存储一些数据并使用它,我会创建一个提供者来构建一个“类”。

    var data = angular.module('data', []);

data.provider('$dataObject',function(){

    this.$get = function($http){

            function DataObject(){

                var field = "testvalue";
                var object = {
                    // ...
                }
            }

            DataObject.prototype.processData = function(){
               // do something
            };

        return {
            Shipment: function(){
                return new Shipment();
            }
        }
    }
});

然后我会在maincontroller中创建该类的实例,将视图中的所有必要数据存储到该对象中,并通过调用类方法对其进行处理。

如果应用程序需要其他功能,例如选择一些内容的对话框,我会重复上述步骤并为该对话框创建一个类。

现在,虽然我很乐意以这种方式做事,但我仍然想知道是否有人会考虑这种不良做法,如果是这样,为什么会这样,我能做些什么呢?

1 个答案:

答案 0 :(得分:1)

为您的模型/数据创建服务/提供者(使用API​​来公开数据),然后将它们注入控制器是“Angular方式”。

当我设计一个角度应用程序时,我会考虑我需要的模型并为它们创建服务。然后我(或并行)思考观点并设计那些观点。我通常也会在此时创建自定义指令。最后,每个视图都有一个控制器,它的工作是粘合视图所需服务的模型/数据。 (使控制器尽可能薄。)