In angular2 style guide there is a section for naming files, where it is specified:
Do follow a pattern that describes the symbol's feature then its type. The recommended pattern is
feature.type.ts
.
Let's say we are writing trading platform. So in the same folder we have directive trade.directive.js
that reference simple view trade.html
. Then we needed to link controller to it: trade.controller.js
. We had some code that was like helpers – thus extracted it to trade.helpers.service.js
(common for Ruby on Rails, thus we wouldn't bother about defining type
part in conventional feature.type.ts
naming).
But then we’ve seen that we have a complex structure that should be initialized for each trade. Thus we extracted this class to it's own TradeViewModel.js
. As it was enormous (like 500 lines), we logically extracted some classes from it, put them into separate files like: TradeGeneralInformation
, TradeProductABody
, TradeProductBBody
etc. now we have like 10 files that is used inside service/controller of trade directive to construct data with some methods attached to it. Thus we are able to have small files with classes that can be composed into big structure we need.
Those things are not services, they are more like POJO in Java – they encapsulate some data. Now inside trade/
folder we have subfolder viewModels/
with these files.
But according to style guide files in angular application should have some suffixes in names e.g. *.directive.js
.
Question: How do you name files with class definitions that are integral parts of Angular application, but doesn't have any Angular objects defined inside?
Or, should we just name them according to the classes they represent and put them in separate folders where they belong logically?