Question

我正在使用基于ES6，Webpack和AngularJS组件的架构来尝试制作入门样板。我有我的app目录，里面有一个index.js，我导出app模块：

import { AppComponent } from './ng/app.component.js';

export default angular
    .module('appModule',[])
    .component('app', AppComponent)

以及js文件的其他两个目录ng和htmls的templates。

在app.component.js内部我要包含.html文件，如下所示：

export const AppComponent = {
    templateUrl: '../templates/app.html',
    controller: class AppController {
        constructor() {
            this.title = "App Page";
        }
    }
}

使用此方法我收到以下错误：

GET http://localhost:8080/templates/app.html 404 (Not Found)

但是当我输入文件src/app/templates/app.html或template: require('../templates/app.html')的完整路径时，它会按预期工作。

有没有办法让templateUrl工作而不必输入需要它的完整路径？

Answer 1

要访问一个没有读取完整路径的页面，您需要创建路径。

AngularJs 1.x https://www.w3schools.com/angular/angular_routing.asp

Angular 2或更高 https://angular.io/tutorial/toh-pt5

Answer 2

我已经看到了一种通过使用会话常量来添加代码的方法 templateUrl: CONFIG.baseUrl +'/templates/app.html'

我也会尝试 templateUrl: ../../templates/app.html'

AngularJS 1.6。组件templateUrl

2 个答案: