Repository navigation
Generated directive selector name should be camelcase #1216
Description
Version
$ ng --version
(node:20286) fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.
Could not start watchman; falling back to NodeWatcher for file system events.
Visit http://ember-cli.com/user-guide/#watchman for more info.
angular-cli: 1.0.0-beta.6
node: 6.2.1
os: linux x64
Repro steps
The following generate command produces a kebab case selector name instead of camelCase.
$ ng g directive shared/directives/wrap-if
(node:20210) fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.
Could not start watchman; falling back to NodeWatcher for file system events.
Visit http://ember-cli.com/user-guide/#watchman for more info.
installing directive
create src/app/shared/directives/wrap-if.directive.spec.ts
create src/app/shared/directives/wrap-if.directive.ts
src/app/shared/directives/wrap-if.directive.ts
import { Directive } from '@angular/core';
@Directive({
selector: '[wrap-if]'
})
export class WrapIf {
constructor() {}
}
As per the styleguide,
Do Use lower camel case for naming the selectors of our directives.
I've passed ng generate the name in kebab case because the README states so and follows the convention of passing the file name where file names should use dashes to separate words in the descriptive name.
I've read #424 and acknowledge that passing the name as camelCase to ng generate produces the correct selector but it is unintuitive and doesn't follow the README. I don't think we should make an exception to the convention of passing kebab case file names to ng generate.
Instead of not modifying the selector name at all for directives, I think they should be modified to be camelCase as per the styleguide.
Activity
choeller commentedon Aug 30, 2016
As an addition according to the Style-Guide, the Selector for Directives should also take the prefix of the app into account. So I would assume
to create a Direktive with the selector
filipesilva commentedon Sep 20, 2016
@Brocco can you weigh in?
Brocco commentedon Sep 24, 2016
The style guide does dictate camelCase for directive selectors and prefixing them with the application prefix. I will put together a PR for this.
Reference: https://angular.io/docs/ts/latest/guide/style-guide.html#!#02-08
bug(generate): directive selectors are now camelCase
bug(generate): directive selectors are now camelCase
bug(generate): directive selectors are now camelCase
bug(generate): directive selectors are now camelCase
bug(generate): directive selectors are now camelCase
nukec commentedon Jun 12, 2019
what if you prefix is kebab case?
app-something, then you are doomed. why is component kebab case and directive camel case in style guide? can't we just use kebab case for everything consistently?angular-automatic-lock-bot commentedon Sep 9, 2019
This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
This action has been performed automatically by a bot.
bug(generate): directive selectors are now camelCase