AngularJS/Javascript代码格式化

我目前正在使用HTML5，JavaScript，Angularjs，Bootstrap，一些PHP和API来开发一个我的小项目，一个小型的Web应用程序。这不是什么大事，只是一些练习的东西。无论如何，据我了解，我做了我的PHP使用MVC约定（使用工人和控制器，分开的东西，如登录与数据库连接和其他...），所以我想知道是否有可能做与我的脚本一样：最后，我看到我一直在我的索引页上编写我的所有脚本，并且想知道是否可以将它们写入工作文件中，并且仅对索引执行调用，因为我'在角度/ javascript中不是很好，我要求一点帮助，因为我不知道如何去做^^'（我知道Java，PHP，HTML，CSS，所以如果你想说明一些事情你说使用这些语言，我会理解的），这里是我的脚本：AngularJS/Javascript代码格式化

var tag = document.createElement('script'); 

tag.src = "https://www.youtube.com/iframe_api"; 
var firstScriptTag = document.getElementsByTagName('script')[0]; 
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 

var player; 
function onYouTubeIframeAPIReady() { 
    player = new YT.Player('player', { 
     height: '390', 
     width: '640', 
     videoId: '9qfb3IlH56I', 
     events: { 
      'onReady': onPlayerReady, 
      'onStateChange': onPlayerStateChange 
     } 
    }); 
} 


function onPlayerReady(event) { 
    event.target.playVideo(); 
} 

var done = false; 
function onPlayerStateChange(event) { 
    if (event.data == YT.PlayerState.PLAYING && !done) { 
     done = true; 
    } 
} 

function stopVideo() { 
    player.stopVideo(); 
} 

//Roads 
var module = angular.module("animeNet", ['ngRoute']); 
module.config(['$routeProvider', 
    function($routeProvider) { 
    $routeProvider. 
     when('/', { 
      templateUrl: 'Login.php' 
     }). 
     when('/anime', { 
      templateUrl: 'anime.html' 
     }). 
     when('/logInFail', { 
      templateUrl: 'logInFail.php' 
     }). 
     when('/api', { 
      controller: 'SpecificPageController', 
      templateUrl: 'Api.html' 
     }). 
     when('/home', { 
      templateUrl: 'home.php'}). 
     when('/inscription', { 
      templateUrl: 'inscription.php'}). 
     when('/test', { 
      controller: 'SpecificPageController', 
      templateUrl: 'test.html' 
     }). 
     otherwise({ 
      redirectTo: '/' 
     }); 
}]); 

//Controller 
module.controller("RouteController", function($scope, $rootScope, $routeParams, $location) { 
    $scope.param = $routeParams.param; 

    $rootScope.$on('$routeChangeStart', function(event, next, current) { 
     $scope.routeShow = $location.path() != '/' && $location.path() != '/inscription'; 
    }); 

}); 

module.controller('SpecificPageController', function($scope, $routeParams) { 
    onYouTubeIframeAPIReady(); 
}); 

//AnimationsOnIndex 
var _gaq = _gaq || []; 
_gaq.push(['_setAccount', 'UA-43092768-1']); 
_gaq.push(['_trackPageview']); 
(function() { 
    var ga = document.createElement('script'); 
    ga.type = 'text/javascript'; 
    ga.async = true; 
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 
    var s = document.getElementsByTagName('script')[0]; 
    s.parentNode.insertBefore(ga, s); 
})();

来源

2015-10-05 Florian Hofer

的Angular Style Guide可能会是一个很好的读。提到的良好实践的一些例子包括：

规则1：定义每个JS文件只有1个组件。在你的情况，你应该分开你的控制器，使得每个控制器都有自己的JS文件，并导入为模块到你的应用程序

命名功能：使用已命名的功能（例如，在你的控制器）来代替匿名函数增加可读性

angular 
.module('app') 
.controller('DashboardController', DashboardController); 

function DashboardController() { }

至于分离的东西，检查出demo project named modular。该app.js看起来是这样的：因此

(function() { 
    'use strict'; 
    angular.module('app', [ 
     'app.core', 
     'app.widgets', 
     'app.avengers', 
     'app.dashboard', 
     'app.layout' 
    ]); 

})();

指令和控制器被声明为模块，这是非常整洁的：

(function() { 
    'use strict'; 

    angular 
     .module('app.widgets') 
     .directive('ccSidebar', ccSidebar); 

    function ccSidebar() {...} 
})();

来源

2015-10-05 11:37:38 Huey

AngularJS/Javascript代码格式化

回答

相关问题