Я использую Angular 4.1.3 с Rails 5.1

Я пытаюсь реализовать компонент приложения, и если я использую шаблон и пишу свой HTML, все работает, но я хочу использовать templateUrl.

Вот мой компонент.

import { Component } from '@angular/core';

@Component({
  selector: 'app',
  templateUrl: './app.component.html'
})
export class AppComponent {}

И это моя файловая структура

├── app
|   ├── app.component.html
|   └── app.component.ts
|   └── app.module.ts

Я понимаю, что в @Component вы можете добавить moduleId: module.id, но я думал, что это больше не требуется в Angular 4.1.3.

Если я добавлю его, он скажет мне: moduleId should be a string in "AppComponent"

Я также подумал, что, если вы не включите модуль Module Angle просто захватывает из корневого каталога, но если я делаю абсолютный путь, он должен работать правильно?

Если бы вы, ребята, могли помочь, это было бы здорово.

1
Doctor06 28 Май 2017 в 20:56

2 ответа

Лучший ответ

Я предполагаю, что вы используете новый webpacker-gem в своем проекте rails!

Описание использования templateUrl здесь приведено в документации: Использование шаблонов HTML с Typescript и Angular

2
coorasse 12 Июн 2019 в 10:09

Если вы хотите сохранить templateUrl, вы можете использовать плагин angular2-template-loader webpack:

# add plugins to project
yarn add angular2-template-loader raw-loader

И настроить его:

# edit config/webpack/loaders/angular.js with
module.exports = {
    test: /.ts$/,
    loaders: ['ts-loader', 'angular2-template-loader'],
    exclude: [/\.(spec|e2e)\.ts$/]
}

# create a new loader for htmls config/webpack/loaders/html.js
module.exports = {
    test: /\.(html)$/,
    loader: 'raw-loader',
    exclude: /\.async\.(html)$/
}
1
Marco Bergantin 7 Июн 2017 в 12:16