diff --git a/component/USAGE b/component/USAGE new file mode 100644 index 000000000..e69de29bb diff --git a/component/index.js b/component/index.js new file mode 100644 index 000000000..2f8d1e531 --- /dev/null +++ b/component/index.js @@ -0,0 +1,18 @@ +'use strict'; +var util = require('util'); +var ScriptBase = require('../script-base.js'); + +var Generator = module.exports = function Generator() { + ScriptBase.apply(this, arguments); +}; + +util.inherits(Generator, ScriptBase); + +Generator.prototype.createComponentFiles = function createComponentFiles() { + this.generateSourceAndTest( + 'component', + 'spec/component', + 'components', + this.options['skip-add'] || false + ); +}; diff --git a/readme.md b/readme.md index 0268ae512..ca220dd47 100644 --- a/readme.md +++ b/readme.md @@ -44,6 +44,7 @@ Available generators: * [angular](#app) (aka [angular:app](#app)) * [angular:controller](#controller) * [angular:directive](#directive) +* [angular:component](#component) * [angular:filter](#filter) * [angular:route](#route) * [angular:service](#service) @@ -127,6 +128,24 @@ angular.module('myMod').directive('myDirective', function () { }); ``` +### Component +Generates a component in `app/scripts/components`. + +Example: +```bash +yo angular:component myComponent +``` + +Produces `app/scripts/components/myComponent.js`: +```javascript +angular.module('myMod').component('myComponent', { + template: '
{{$ctrl.message}}
', + controller: function () { + this.message = 'this is the myComponent component'; + } +}); +``` + ### Filter Generates a filter in `app/scripts/filters`. diff --git a/templates/coffeescript/component.coffee b/templates/coffeescript/component.coffee new file mode 100644 index 000000000..2b0f1cc57 --- /dev/null +++ b/templates/coffeescript/component.coffee @@ -0,0 +1,14 @@ +'use strict' + +###* + # @ngdoc component + # @name <%= scriptAppName %>.component:<%= cameledName %> + # @description + # # <%= cameledName %> +### +angular.module '<%= scriptAppName %>' + .component '<%= cameledName %>', + template: '
{{$ctrl.message}}
' + controller: -> + this.message = 'this is the <%= cameledName %> component' + return diff --git a/templates/coffeescript/spec/component.coffee b/templates/coffeescript/spec/component.coffee new file mode 100644 index 000000000..033a25fd8 --- /dev/null +++ b/templates/coffeescript/spec/component.coffee @@ -0,0 +1,18 @@ + +'use strict' + +describe 'Component: <%= cameledName %>', -> + + # load the component's module + beforeEach module '<%= scriptAppName %>' + + scope = {} + + beforeEach inject ($rootScope) -> + scope = $rootScope.$new() + + it 'should make hidden element visible', inject ($compile) -> + element = angular.element '<<%= _.dasherize(name) %>>>' + element = $compile(element) scope + scope.$apply() + expect(element.text()).toBe 'this is the <%= cameledName %> component' diff --git a/templates/common/root/_bower.json b/templates/common/root/_bower.json index 498d2434b..9bdcbd4f3 100644 --- a/templates/common/root/_bower.json +++ b/templates/common/root/_bower.json @@ -1,4 +1,4 @@ -{<% var ngVer = "1.4.0" %> +{<% var ngVer = "1.5.7" %> "name": "<%= _.slugify(_.humanize(appname)) %>", "version": "0.0.0", "dependencies": { diff --git a/templates/javascript/component.js b/templates/javascript/component.js new file mode 100644 index 000000000..cc9120132 --- /dev/null +++ b/templates/javascript/component.js @@ -0,0 +1,15 @@ +'use strict'; + +/** + * @ngdoc component + * @name <%= scriptAppName %>.component:<%= cameledName %> + * @description + * # <%= cameledName %> + */ +angular.module('<%= scriptAppName %>') + .component('<%= cameledName %>', { + template: '
{{$ctrl.message}}
', + controller: function () { + this.message = 'this is the <%= cameledName %> component'; + } + }); diff --git a/templates/javascript/spec/component.js b/templates/javascript/spec/component.js new file mode 100644 index 000000000..4f406cdc4 --- /dev/null +++ b/templates/javascript/spec/component.js @@ -0,0 +1,20 @@ +'use strict'; + +describe('Component: <%= cameledName %>', function () { + + // load the components's module + beforeEach(module('<%= scriptAppName %>')); + + var element, scope; + + beforeEach(inject(function ($rootScope) { + scope = $rootScope.$new(); + })); + + it('should make hidden element visible', inject(function ($compile) { + element = angular.element('<<%= _.dasherize(name) %>>>'); + element = $compile(element)(scope); + scope.$apply(); + expect(element.text()).toBe('this is the <%= cameledName %> component'); + })); +}); diff --git a/test/component.js b/test/component.js new file mode 100644 index 000000000..52ebbbf99 --- /dev/null +++ b/test/component.js @@ -0,0 +1,22 @@ +'use strict'; +var fs = require('fs'); +var path = require('path'); +var helpers = require('yeoman-test'); +var assert = require('yeoman-assert'); + +describe('angular:component', function () { + beforeEach(function (done) { + helpers + .run(require.resolve('../component')) + .withArguments('foo') + .on('end', done); + }); + + it('generates a new component', function () { + assert.file('test/spec/components/foo.js'); + assert.fileContent( + path.join('app/scripts/components/foo.js'), + /component\('foo'/ + ); + }); +});