@uoziod6 сен 2014 в 14:26

Смелый стайлгайд по AngularJS для командной разработки [1/2]

5 мин

39K

JavaScript * Angular *

Перевод

+33

Комментарии 22

@xGromMx 6 сен 2014 в 20:13

Есть же =) github.com/johnpapa/angularjs-styleguide

@uoziod 6 сен 2014 в 20:23

Действительно, они буквально на грани! Спасибо за ссылку!

@student_ivan 6 сен 2014 в 20:51

Нужно больше конкретики, а то местами не совсем ясно, почему «так хорошо, а так плохо».

@Ganesh 6 сен 2014 в 23:49

«MainCtrl» Насколько я знаю, в стайлгайдах (читал много где, а так же в ng-book) настойчиво рекомендуют писать не Ctrl, а Controller, обосновывая тем, что избегание сокращений является хорошим тоном при программировании.

«Если вы используете prototype для изоляции от других контроллеров – это хорошо.» Хотелось бы подробнее, что значит изоляция от других контроллеров?

Пример про IIFE, как-то адово описан, может стоило сначала указать на то, что следует разделять компоненты модуля на отдельные файлы, а потом показывать как использовать данную технику.

По идее реализации функций нужно писать как можно ниже, дабы код был читаемым.

Как-то странно вообще использовать $parent в шаблоне.

Пример про фабрики странный какой-то, вполне правильно использовать и var someValue = ''; особенно если нужно реализовать приватные свойства\методы или например шорткаты.

@xskif 7 сен 2014 в 06:01

Уже много раз встречал разногласия по поводу $scope и this. Так и не понял что лучше. В исходниках angular-ui

@Ganesh 7 сен 2014 в 15:07

github.com/johnpapa/angularjs-styleguide#controllers вот тут прям отлично описано.

@xskif 8 сен 2014 в 11:08

это то что я искал, спасибо, только:

Добротный ответ на ваш вопрос — stackoverflow.com/a/14168699/1104483

это несколько разнится с вашим ответом. Опять же. Кому верить?) я склонен считать что пора использовать this. Даже в курсе от CodeSchool, который проспонсировали Google, испольуется this вместо $scope.

@xskif 7 сен 2014 в 06:06

В исходниках angular-ui пишут var self = this = $scope;
Кому верить.

Извиняюсь за два сообщения, писал с мобильного.

@vermilion1 7 сен 2014 в 09:50

Добротный ответ на ваш вопрос — stackoverflow.com/a/14168699/1104483

@xskif 8 сен 2014 в 11:14

вот опять же, написано что автор старается избегать this из за возможности создания изолированных $scope, но это относится к директивам больше чем к контроллерами, более того из за constrollerAs синтаксиса мы получаем символ аксессора к свойствам контроллера, а в случае с $scope нужно создавать отдельный vm ($socpe.vm = {}). Про проблемы с директивами я в принципе слышал, но на том же CodeSchool нет проблем с изолированным $scope при использовании this и controllerAs.

Выше ответили — github.com/johnpapa/angularjs-styleguide#controllers
Я склонен согласиться с этим стайл гайдом.

@JiLiZART 7 сен 2014 в 19:22

Думаю раньше this в контроллерах не было, был только $scope, сейчас есть this.

@xskif 8 сен 2014 в 11:15

Скорее всего, Вы правы. Пора переучиваться на this. Да и код получится проще.

@kriptomen 7 сен 2014 в 10:18

Я вот момент не понял

controllerAs-синтаксис… делает скоупы вложенными

вложенными относительно чего?

@xGromMx 7 сен 2014 в 11:27

Ну смотрите. пусть есть 3 контроллера с вложенностью

<div ng-controller="ParentCtrl as p">
  <div ng-controller="ChildFirstCtrl as cf">
    <div ng-controller="ChildSecondCtrl as cs">
      Пример использования данных из родительского контроллера в дочернем {{ p.a + cf.b * cs.c }}
    </div>
  </div>
</div>

У нас есть возможность использовать данные из родительских контроллеров в дочернем.

@kriptomen 7 сен 2014 в 11:54

Спасибо, предельно ясно. :)

@xGromMx 7 сен 2014 в 15:28

Если вам интересно, вот мой проекта ради веселья в котором есть этот подход, только в angular ui router github.com/xgrommx/angular-vk-app

@kriptomen 7 сен 2014 в 18:12

Интересно! :) Но с первых строк колдунство с es6, боже мой, как я отстал от жизни!

@xGromMx 7 сен 2014 в 18:44

Доганяйте =)

@limitium 9 сен 2014 в 09:45

Есть очень приятная штука github.com/CaryLandholt/ng-classify
Позволяет писать вот такие штуки. Это лучшее, что я нашел для ангуляра

class Home extends Controller
    constructor: (userService) ->
        @ save = (username) ->
            userService.addUser username

@xGromMx 19 сен 2014 в 10:36

Coffeescript не особо =) лучше тогда юзать traceur compiler от Google и писать в новомодном ES6. Пример контроллера github.com/xgrommx/angular-vk-app/blob/master/app/src/controllers/FriendsCtrl.es6.js и его объявление в ангуляре github.com/xgrommx/angular-vk-app/blob/master/app/src/controllers/main.es6.js

@artch 19 сен 2014 в 09:19

Модули в AngularJS могут быть объявлены различными способами: либо с использованием переменной, либо через getter-синтаксис. Всегда используйте второй способ (более того, он рекомендован разработчиками фреймворка).

А можно конкретно ткнуть в место по указанной ссылке, где разработчики такое рекомендуют?

@chuikoffru 18 дек 2014 в 04:57

Спасибо, начал следовать вашему стайлгайду. Поставил Batarang, он начал выдавать Hint'ы якобы:

1. app не подходит как название для приложения, лучше используйте CamelCase, типа MyApp.
2. CartCtrl не красиво, лучше используйте CartController

Дабы не доставали эти хинты, пришлось последовать его совету.

Зарегистрируйтесь на Хабре, чтобы оставить комментарий