Добавление нового модуля AngularJS FountainJS (Yeoman)

Question

Я использую fountainJS и у меня возникла проблема с этой сеялкой AngularJS. Я думаю, что я могу развиваться с этим эшафотом, потому что, помимо того, что у вас есть несколько предустановленных вещей, это облегчит мне работу позже.

My architecture

и файлы моего модуля "eventsList" являются это:

./src/app/eventsList/eventsList.js

class EventsListController{ 
    constructor(){ 
     this.hola = "hola"; 

     this.event = { 
      name: "das", 
      place: "", 
      day: "", 
      hour: "" 
     }; 

     this.events = [ 
      { 
       name: "nombre alerta", 
       place: "lugar", 
       day: "dia" 
      }, 
      { 
       name: "nombre alerta 222", 
       place: "lugar", 
       day: "dia" 
      } 
     ]; 

    }; 
}; 

export const eventsList = { 
    templateurl: 'app/eventsList/eventsList.html', 
    controller: EventsListController 
}; 

./src/ app/eventsList/index.js

import angular from 'angular'; 

import {eventsList} from './eventsList'; 

export const eventsListModule = 'eventsList'; 

angular 
.module(eventsListModule, []) 
.component('eventsList', eventsList); 

И HTML компонента в ./src/app/eventsList/eventsList.html

<div class="techs"> 
    <div> 
     {{$ctrl.hola}} 
     {{$ctrl.event.name}} 
     {{$ctrl.events}} 
     <select ng-options="evento in $ctrl.events"> 
      <option value="">Choose City</option> 
     </select> 
    </div> 
</div> 

Вот основной вид моего приложения и моей директивы моего модуля. в ./src/app/main.html

<events-list></events-list> 
<div class="main-container"> 
    <fountain-header></fountain-header> 
    <main class="main"> 
    <fountain-title></fountain-title> 
    <fountain-techs></fountain-techs> 
    </main> 
    <fountain-footer></fountain-footer> 
</div> 

Тогда я зарегистрировал свой модуль в в ./src/index.js из приложения, в корне моего проекта, как это:

import angular from 'angular'; 

import {techsModule} from './app/techs/index'; 
import {eventsListModule} from './app/eventsList/index'; 
import 'angular-ui-router'; 
import routesConfig from './routes'; 

import {main} from './app/main'; 
import {header} from './app/header'; 
import {title} from './app/title'; 
import {footer} from './app/footer'; 

import './index.less'; 

angular 
    .module('app', [techsModule, eventsListModule, 'ui.router']) 
    .config(routesConfig) 
    .component('app', main) 
    .component('fountainHeader', header) 
    .component('fountainTitle', title) 
    .component('fountainFooter', footer); 

Когда я иду в браузер, он не работает так, как я ожидаю, потому что я не вижу html моего модуля, но я думаю, что я нахожусь в пути, потому что мой модуль находится в DOM и с его областью выделения.

результат в браузере:

Есть sugestions, чтобы исправить это?

Заранее спасибо.

Answer 1

У вас есть опечатка, вам необходимо заменить templateurl на templateUrl.

Answer 2

Я думаю, вы забыли добавить <events-list></events-list> в свой html.