mongooseError directive

[smoglica]

• [ ] I understand that GitHub issues are not for tech support, but for questions specific to this generator,

reports, and feature requests.

Item	Version
generator-angular-fullstack	4.2.2
Node	7.1.0
npm	4.2.0
Operating System	OS X 10

Item	Answer
Transpiler	TypeScript
Markup	Pug
CSS	SCSS
Router	ui-router
Client Tests	Mocha
DB	MongoDB
Auth	Y

The mongooseError directive which should set $validity to false on keydown on input field is not working. This directive for some reason is not included in the main app.bundle.js even if I try to modify the file mongoose-error.directive.ts the auto reload browser is not watching that file. Someone have the same issue? What is the best approach to include this file ?

[Awk34]

If you would like to include a file in one of your bundles, all you have to do is import it into another file that's already used

[smoglica]

I'm already doing it as you said, but theoretically how is written the mongooseDirective there is no reason to do that:

angular.module('demoApp')
  .directive('mongooseError', function () {
    return {
      restrict: 'A',
      require: 'ngModel',
      link: function(scope: ng.IScope, element: JQuery, attrs, ngModel) {
        element.on('keydown', function() {
          return ngModel.$setValidity('mongoose', true);
        });
      }
    };
  });

As we can see it's retrieving an existing module (angular.module Reference) which is the root module called in this case demoApp and binding to it a new directive. I guess this directive it was written in order to work without modifying any file or inserting new imports..

Therefore now in order to use this directive I'm doing this but I had to modify the file...

In mongoose-error.directive.ts

angular.module('demoApp.mongooseError', [])
  .directive('mongooseError', function () {
    return {
      restrict: 'A',
      require: 'ngModel',
      link: function(scope: ng.IScope, element: JQuery, attrs, ngModel) {
        element.on('keydown', function() {
          return ngModel.$setValidity('mongoose', true);
        });
      }
    };
  });

In app.ts

import mongooseError from '../components/mongoose-error/mongoose-error.directive';

angular.module('demoApp', [mongooseError, ...]);

[albert-92]

I had the exact same issue with 4.2.2. I solved it like you did, expect that i added an export default

in mongoose-error.directive.ts

export default angular.module('demoApp.mongooseError', [])
...

Before that the watcher didn't even recognize when mongoose-error.directive.ts was changed.