2016-01-17 72 views
0

我正在嘗試學習angular.js並已經看到了一些不同的方式來初始化模塊和控制器。正確的方式來初始化角度模塊和控制器

這裏是我如何通過調試一個網站,我一直在使用它作爲指導。

var myApp = angular.module("myApp", []); 
myApp.controller("myController", myController); 

function myController($scope) { 
    //some code 
} 

她是我見過它的幾個不同的教程

angular.moudule('myApp', []).controller('myController', function($scope){ 
    //some code 
} 

我明白,這可能是個人喜好,但我想知道是否有一個做的方式首選的方式或更乾淨的方式來做到這一點。如果還有更好的方法,請提及。

+1

這是我使用的風格指南:https://github.com/johnpapa/angular-styleguide – Red2678

+0

我喜歡這本指南,我會通讀它 –

回答

1

這兩種方式有一個以上的區別:

  • 有一個全局變量
  • 鏈接方法
  • 內聯回調函數

這讓我們從你的兩個例子中的八個組合,這使得每個繁瑣的直接比較。使用你認爲對你(和你的團隊)來說最具可讀性的任何東西,並且適合於項目(例如,你需要在代碼的其他地方使用myApp變量,例如從外部文件加載組件等)。如果你仍然不能決定,有幾個角度的風格指南在線,探索他們。

0

我也跟着約翰爸爸的風格指南..按你應該定義控制器用作

/* recommended */ 

// some.controller.js 
angular 
    .module('app') 
    .controller('SomeController', SomeController); 

function SomeController() { } 
0

的方法有很多,但總是重複使用一個更好的和有益的。

保持模塊中的單獨的變量

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

 
myApp.controller('FirstController', ['$scope', function($scope) { 
 
    $scope.greet = 'Hi Im First Controller !'; 
 
}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="FirstController"> 
 
    {{ greet }} 
 
</div>

鏈接方法

var myApp = angular.module('myApp',[]).controller('SecondController', ['$scope', function($scope) { 
 
     $scope.greet = 'Hi Im Chained Second Controller !'; 
 
    }]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
    <div ng-app="myApp" ng-controller="SecondController"> 
 
     {{ greet }} 
 
    </div>

相關問題