Одностраничные приложения с AngularJS - Как моделировать?

0

Я основал одностраничное приложение, основанное на этом учебнике:

https://scotch.io/tutorials/single-page-apps-with-angularjs-routing-and-templating

это файловая структура, которую они предложили:

 - script.js             <!-- stores all our angular code -->
    - index.html            <!-- main layout -->
    - pages                 <!-- the pages that will be injected into the main layout -->
    ----- home.html
    ----- about.html
    ----- contact.html

часть о html-страницах довольно проста - страница для каждого ng-представления. круто...

но script.js кажется мне плохой моделью.

Должен ли я поместить весь мой код js в один файл?

мне кажется, что это не лучший способ ее моделирования.

что случилось, если у меня будет много страниц в моем приложении с одной страницей?

У меня будет длинный длинный один файл js со всеми контроллерами.

Какова наилучшая практика моделирования одностраничного приложения в angularjs?

Благодарю!

// script.js

    // create the module and name it scotchApp
        // also include ngRoute for all our routing needs
    var scotchApp = angular.module('scotchApp', ['ngRoute']);

    // configure our routes
    scotchApp.config(function($routeProvider) {
        $routeProvider

            // route for the home page
            .when('/', {
                templateUrl : 'pages/home.html',
                controller  : 'mainController'
            })

            // route for the about page
            .when('/about', {
                templateUrl : 'pages/about.html',
                controller  : 'aboutController'
            })

            // route for the contact page
            .when('/contact', {
                templateUrl : 'pages/contact.html',
                controller  : 'contactController'
            });
    });

    // create the controller and inject Angular $scope
    scotchApp.controller('mainController', function($scope) {
        // create a message to display in our view
        $scope.message = 'Everyone come and see how good I look!';
    });

    scotchApp.controller('aboutController', function($scope) {
        $scope.message = 'Look! I am an about page.';
    });

    scotchApp.controller('contactController', function($scope) {
        $scope.message = 'Contact us! JK. This is just a demo.';
    });
Теги:
model-view-controller
model

1 ответ

1
Лучший ответ

Этот исчерпывающий стиль предлагает создавать папки и оцифровывать ваше приложение на основе функций. https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#application-structure

Я рекомендую прочитать весь раздел "Структура приложения", который действительно помог мне организовать мои угловые проекты

  • 0
    Проблема в том, что в одностраничном приложении у меня есть множество функций, содержащихся в одном файле.
  • 1
    Одна страница не означает один файл. Ничто не мешает вам разделить одностраничные приложения. Например, вы можете создать отдельный файл для каждого контроллера.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню