templateUrl不起作用
我正在尝试制作angular2-material应用程序
它适用于我的template: ~但如果我使用templateUrl: ~ ， <my-app>甚至没有包含Loading...和networking日志告诉我模板成功加载200 GET /app/mainLayout.html
基本上，我遵循angular2文档的快速入门指南 ，这些都是我所做的
- 通过npm安装angular2-materialize
- 在
main.tsimport "angular2-materialize" - 在index.html中添加System.config
的index.html
<!-- 2. Configure SystemJS --> <script src="systemjs.config.js"></script> <script> System.config({ defaultJSExtensions: true, packages: { "materialize-css": { "main": "dist/js/materialize" }, "materialize": { "main": "dist/materialize-directive", "defaultExtension": "js" } }, map: { "materialize-css": "node-modules/materialize-css", "materialize": "node_modules/angular2-materialize", "angular2-materialize": "node_modules/angular2-materialize" } }); System.import('app').catch(function(err){ console.error(err); }); </script>
- 在app.component.ts中添加MaterializeDirective
app.component.ts
import { Component } from '@angular/core'; import { MaterializeDirective } from 'angular2-materialize'; @Component({ selector: 'my-app', directives: [MaterializeDirective], templateUrl: 'app/views/mainLayout.html', styleUrls: ['/app/css/mainLayout.css'] }) export class AppComponent { }
这是我的工作目录
| |-app | |-css | | |-mainLayout.css | |-views | | |-mainLayout.html | | | |-app.component.ts | |-main.ts | |-node_modules | |-(....) |-typings | |-globals | | |-(...) | |-index.d.ts |-package.json |-systemjs.config.js |-tsconfig.json |-typings.json
还有一件事。 我认为 – 无论template:声明 – 似乎有些path设置错误。 * .js文件加载成功，但* .map文件不是。
[1] 16.06.21 20:17:15 200 GET /node_modules/rxjs/Subject.js [1] 16.06.21 20:17:15 404 GET /node_modules/systemjs/dist/Subject.js.map
喜欢这个
尝试
@Component({ selector: 'my-app', directives: [MaterializeDirective], templateUrl: './app/views/mainLayout.html', styleUrls: ['/app/css/mainLayout.css'] })
关键的区别是'./app/ 。 这使得Angular在当前根/app/views/查找“mainLayout.html”。
虽然我不知道发生了什么事情，但是我却以某种方式解决了这个问题。 几乎没有重新启动npm和app/views/mainLayout.html是解决scheme。 但是angular2仍然在错误的path中find.map。 请让我知道为什么会发生，如果有人有一个想法。