Creating new component with AngularJS

help
1

I’m using angular 1.x with meteor-angular and I’m trying to create a new component in my app. I still struggling with this after a few hours…

I’ve got a component called plateEditand another different one photo. In both I need to repeat a block of code (also in the view) so I decided to create a third component called edition.

So I create another folder in my folder component called edition with edition.js, edition.html and edition.scss

The .js has this code:

import angular from 'angular';
import angularMeteor from 'angular-meteor';

import { Meteor } from 'meteor/meteor';

import templateUrl from './edition.html';

class Edition {
    constructor($scope, $reactive) {
        'ngInject';
    }
}

const name = 'edition';

// create a module
export default angular.module(name, [
    angularMeteor,
    uiRouter
])
.component(name, {
    templateUrl,
    controllerAs: name,
    controller: Edition
});

Until this point everything’s normal. I can run the app as normally.

So I have to import my new component in plateEdit first:
import { name as Edition } from ‘…/edition/edition’;

export default angular.module(name, [
	angularMeteor,
    uiRouter,
    Edition
...

And when I run now my app I’ve got a huge error. Imposible to track or paste but the first lines say:

modules.js?hash=d314604…:831Uncaught Error: [$injector:modulerr] Failed to instantiate module foodApp due to:
Error: [$injector:modulerr] Failed to instantiate module plateEdit due to:
Error: [$injector:modulerr] Failed to instantiate module undefined due to:
Error: [ng:areq] Argument 'module' is not a function, got undefined
I have to say I've got 40 components in my app and all of them are working perfectly.

Did I miss something?
Thanks in advance

2

Hello erperejildo,
I have the same problem. You managed to solve it?

3

Hi artoo,
I fixed it creating other component by default are you using angular-meteor with TS as well? I can share with you a “default component” (as I called it)

4

hey i also want to create a new component that run as localhost:3000/new
how to do it. the contents of new component and old one show on same page.
plzz help