2014-02-13 55 views
0

我正在用AngularJS和Threejs編寫一個簡單的星系模擬項目(想得更簡單http://workshop.chromeexperiments.com/stars/)。使用Angular JS只是爲了讓我能夠理解它的工作原理,並將其用於其他項目。Angular JS - 我的代碼應該放在哪裏?

但是,我對我的很多代碼應該在哪裏生活感到有點困惑。由於threejs代碼輸出到一個畫布,我猜代碼應該生活在一個指令?或者我應該在控制器中執行大部分處理,並且只需在指令中添加任何DOM特定的代碼?

您可以在組織在這裏看到我目前的嘗試:https://github.com/donnielrt/galaxy/tree/873dba548d8d42820febeb4e69817f2e5fc5333c/app

回答

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> 
相關問題