Question

请帮助新手。

我开始使用Cordova，jQuery mobile和angularJS构建一个Android应用程序的项目，我想知道这个结构是否正常。 index.js启动应用程序，app.js文件包含逻辑。我不知道将所有内容放在一个文件中是否是一个好主意。

你怎么看？您能否就如何更好地组织我的代码提出建议？

先谢谢，这里有结构和文件，问候！

树www文件夹是：

|-- css
|   |-- app.css
|   |-- app-theme.min.css
|   |-- images
|   |   |-- ajax-loader.gif
|   |   `-- refresh-black.png
|   |-- jquery.mobile.icons.min.css
|   |-- jquery.mobile.structure.min.css
|   `-- normalize.css
|-- img
|   |-- logo.png
|   `-- profile.png
|-- index.html
|-- js
|   |-- app.js
|   |-- index.js
|   `-- lib
|       |-- angular.min.js
|       |-- angular-route.min.js
|       |-- angular-touch.min.js
|       |-- jquery.min.js
|       `-- jquery.mobile.min.js
`-- templates
    |-- capturePhoto.html
    `-- main.html

index.js：

(function init() {
    document.addEventListener('deviceready', function(){ app.init(); }, false);
}());

app.js：

'use strict';

var app = {
    init: function() {
        navigator.splashscreen.hide();
        this.angular.config();
        this.angular.mainControllers();
        angular.bootstrap(document, ['exampleApp']);
    },
    angular: {
        config: function() {
            angular.module('exampleApp', ['ngRoute', 'ngTouch', 'exampleControllers']).config(function($routeProvider) {
                $routeProvider.
                  when('/', {
                    templateUrl: 'templates/main.html',
                    controller: 'ProfileCtrl'
                  }).
                  when('/action/capturePhoto', {
                        templateUrl: 'templates/capturePhoto.html',
                        controller: 'ProfileCtrl'
                  }).
                  otherwise({
                    redirectTo: '/'
                  });
              });       
        },
        mainControllers: function() {
            var exampleControllers = angular.module('exampleControllers', []);

            exampleControllers.controller('ProfileCtrl', function($scope) {
                $scope.child = {
                        name: 'test name',
                        profileImage: 'img/profile.png',
                        birthday:  '01/01/2014'

                };
            });

            exampleControllers.controller('ActionsCtrl', function($scope ,$location) {
                $scope.capturePhoto = function() {
                    $location.path('/action/capturePhoto');
                    app.camera.capturePhoto();
                };
            });

            exampleControllers.controller('MenuCtrl', function($scope) {
                $scope.getLocation = function() {
                    app.geolocation.getLocation();  
                };
            }); 
        }
    },
    geolocation: {
        getLocation: function() {
            function onSuccess(position) {
                alert('Latitude: ' + position.coords.latitude + '\n'
                        + 'Longitude: ' + 
[...]

Answer 1

IMO随着应用程序的增长，很难管理一个文件。

我还习惯于简单地开始我的项目，但总是最终分成其他文件，例如：

js/
    app.js
    controllers.js
    services.js
    ...

然后再进一步

js/
    controllers/
        page1Ctrl.js
        page2Ctrl.js
        ...

我不了解你，但对我来说，过多地缩进代码会使写入和阅读变得困难。

这是我用于角度应用程序的方法：

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

app.controller('ProfileCtrl', ['$scope', function ($scope) {
    'use strict';

    $scope.child = {
        name: 'test name',
        profileImage: 'img/profile.png',
        birthday: '01/01/2014'

    };
}]);

app.controller('ActionsCtrl', ['$scope', '$location', function ($scope, $location) {
    'use strict';

    $scope.capturePhoto = function () {
        $location.path('/action/capturePhoto');
        app.camera.capturePhoto();
    };
}]);

app.controller('MenuCtrl', ['$scope', function ($scope) {
    'use strict';

    $scope.getLocation = function () {
        app.geolocation.getLocation();
    };
}]);

唯一的缺点是每次创建时都必须在index.html中包含js文件。

如果您打算使用此数组，则使用参数名称传递给angular的控制器的数组用于缩小目的。

另请注意，您不需要等待“设备准备就绪”。开始初始化角度模块。

希望这会有所帮助。

Answer 2

以下种子AngularJS项目可能对您有所帮助：

Angular Seed

Cordova，jQuery，AngularJS项目结构

2 个答案: