Angular JS - 我的代码应该放在哪里?

时间:2014-02-13 06:09:24

标签: javascript angularjs three.js

我正在用AngularJS和Threejs编写一个简单的星系模拟项目(比较简单http://workshop.chromeexperiments.com/stars/)。使用Angular JS只是为了让我能够理解它是如何工作的,并将其用于其他项目。

但是,我对我的许多代码应该存在的地方感到有些困惑。由于threejs代码输出到画布,我猜测代码应该存在于指令中?或者我应该在控制器中执行大部分处理,只是将任何特定于DOM的代码添加到指令中?

您可以在此处查看我目前在组织中的尝试:https://github.com/donnielrt/galaxy/tree/873dba548d8d42820febeb4e69817f2e5fc5333c/app

1 个答案:

答案 0 :(得分:1)

任何DOM操作或其他行为(响应某些事件而执行的代码)都应该在指令中。

所有的视图模型代码,前端所需的模型以及操作视图模型或与服务交互所需的功能都应位于控制器中。

您应该为与第三方(REST)API或您自己的自定义服务层代码交互的任何部分编写服务或工厂。

您可以使用过滤器修改某些文本以供显示。

您可以使用常量或值来存储常量或值。

一些JS示例

angular.module("testApp",[]).controller("MyCtrl",function($scope){
  $scope.scopedVar = "from the controller";
}).value("someObject",{someProp:"someValue"}
).constant("SOMECONST",3.14
).directive("myThing", function(){
  return {
    restrict:"E" // E (element), C (class), M (comment), A (attribute)
    scope:{}, // optional =, &, @
    template: "<div>Some custom directive</div>",
    link: function(scope, iElem, iAttrs){
      //do some custom things here to modify the directive element or it's children
    }
  }
}).filter("myFilter",function(input){
   var output=input + "did something";
   return output;
});

一些HTML

<body ng-app="testApp" ng-controller="MyCtrl">
  <my-thing></my-thing>
  {{scopedVar | myFilter}}
</body>