Has to be written manually - angularjs has no 'designer'
Rules for camel casing (from the docs) - Snip:
Angular normalizes an element's tag and attribute name to determine which elements match which directives. We typically refer to directives by their case-sensitive camelCase normalized name (e.g. ngModel). However, since HTML is case-insensitive, we refer to directives in the DOM by lower-case forms, typically using dash-delimited attributes on DOM elements (e.g. ng-model).
The normalization process is as follows:
Strip x- and data- from the front of the element/attributes.
Convert the :, -, or _-delimited name to camelCase.
>Do you edit/simplify "manually" or is each line generated ? If generated, what is the rule for CamelCasing ?
>
>
>>>Hmm. Not the syntax I use. Can you point me to the documentation for that variation ?
>>>
>>>
>>>> The problem turned to be in the site.css - the class was correctly applied, but I've changed the class definition to apply on children. I don't remember the purpose of that change which was done in March - apparently the effect of it I found now. Anyway, I fixed it.
>>>
>>>That was going to be my next suggestion :-}
>>
>>I could not find the example using that syntax either. In that particular form I fixed the syntax to be much simpler. But we have many forms using the syntax I showed and it works for them. I don't know who came up with that syntax originally in the project (it was started by external team of contractors but then turned over to internal developers).
>>
>>Anyway, the simpler version of the form is now
>>
>>
>><ul class="nav nav-pills nav-stacked">
>> <li class="active"><a data-toggle="pill" href="#general" ng-class="{'invalid-tab': form.editTemplateGeneralForm.$invalid}">@Labels.general</a></li>
>> <li><a data-toggle="pill" href="#startingValues" ng-class="{'invalid-tab': form.editTemplateStartingValuesForm.$invalid}">@Labels.startingValues</a></li>
>> <li><a data-toggle="pill" href="#globalSettings" ng-class="{'invalid-tab': form.editTemplateGlobalSettingsForm.$invalid}">@Labels.globalSettings</a></li>
>> <li><a data-toggle="pill" href="#autoPassValidation" ng-class="{'invalid-tab' : form.editTemplateAutoPassValidationForm.$invalid}">@Labels.autoPassValidation</a></li>
>> <li><a data-toggle="pill" href="#scanningRestrictions" ng-class="{'invalid-tab': form.editTemplateScanningRestrictionsForm.$invalid}">@Labels.scanningRestrictions</a></li>
>> <li><a data-toggle="pill" href="#autosales" ng-class="{'invalid-tab' : form.editTemplateAutoSalesForm.$invalid}">@Labels.autoSales</a></li>
>> <li><a data-toggle="pill" href="#autosaleOptions" ng-class="{'invalid-tab': form.editTemplateAutosaleOptionsForm.$invalid}">@Labels.autoSaleOptions</a></li>
>> <li><a data-toggle="pill" href="#remoteValidation" ng-class="{'invalid-tab': form.editTemplateRemoteValidationForm.$invalid}">@Labels.remoteValidation</a></li>
>> <li><a data-toggle="pill" href="#inhouseCards" ng-show="currentTemplate.tmplType == 1" ng-class="{'invalid-tab': form.editTemplateInHouseCardsForm.$invalid}">@Labels.inHouseCards</a></li>
>> </ul>
>>
>>I am not going to fix all other forms, unless I'll get a task for that, though.