Question

我正在使用HTML5，JavaScript，Angularjs，Bootstrap，一些PHP和API来开发我的一个小项目，一个小型的Web应用程序。这不算什么大，只是一些练习的东西。无论如何，正如我所知，我使用MVC约定（使用工作者和控制器，分离事物，如使用数据库连接和其他的登录......）进行我的PHP，所以我想知道是否可以做与我的脚本一样：最后，我看到我在索引页面上编写了所有脚本，我想知道是否可以在工作文件中编写它们，只是对索引进行调用，因为我我在角度/ javascript方面不是那么好，我要求一些帮助，因为我不知道怎么做^^'（我知道Java，PHP，HTML，CSS，所以如果你想说明一些东西你说使用那些语言，我明白了。这是我的脚本：

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);
})();

Answer 1

Angular Style Guide 可能会很好读。提到的良好做法的一些例子包括：

规则1：每个JS文件只定义一个组件。在您的情况下，您应该将控制器分开，以便每个控制器都有自己的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 () {...}
})();

AngularJS / Javascript代码格式化

1 个答案: