* ng编译文件到dist文件夹时不使用templateUrl

我使用angular2.0.0-rc4。我已经设置了gulp任务，将所有需要的文件推送到一个dist文件夹中，以便进行持续集成。然而，这样做似乎打破*ngFor时，在组件中使用templateUrl。角度很简单

组件/strong>

import { Component } from '@angular/core';
@Component({
  moduleId: module.id,
  selector: 'app',
  templateUrl: 'app.component.html'
})
export class AppComponent {
  names:string[];
  constructor(){
     this.names=['name1','name2','name3']
  }
 }

<ul>
  <li *ngFor="let name of names">{{name}}</li>
</ul>

我得到错误Can't bind to 'ngforOf' since it isn't a known native property

对于/dist，我正在传递我认为在gulp任务中需要的库

return gulp.src([ 'systemjs/dist/system-polyfills.js', 'systemjs/dist/system.src.js', 'reflect-metadata/Reflect.js', 'rxjs/**', 'zone.js/dist/**', '@angular/**', 'core-js/**' ], { cwd: 'node_modules/**' }) .pipe(gulp.dest('./dist/lib'));
然后在systemjs.config.js
中修改映射
var map = { 'app': 'app', // 'dist', '@angular': 'lib/@angular', 'angular2-in-memory-web-api': 'lib/angular2-in-memory-web-api', 'rxjs': 'lib/rxjs' };
在index.html上，我也从新创建的/dist/lib文件夹中调用库，像这样

 <script src="lib/core-js/client/shim.min.js"></script> <script src="lib/zone.js/dist/zone.js"></script> <script src="lib/reflect-metadata/Reflect.js"></script> <script src="lib/systemjs/dist/system.src.js"></script>
如果我使用标准的"方式"，从node_modules文件夹中调用，并把index.html放在站点的根目录上，那么一切都可以正常工作。只是当我在子文件夹(/dist)
中使用它时就不一样了
不太确定我在这里做错了什么，有什么解决方案的建议，甚至更好的方法吗?
谢谢

你没有做错，Angular 2默认不支持相对路径。

Angular 2教程
这可以在链接中找到:

我们指定的路径会一直回到应用的根目录——在本例中是app/——因为Angular默认不支持相对路径。如果愿意，我们可以切换到组件相对路径。

https://angular.io/docs/ts/latest/cookbook/component-relative-paths.html

我和你有同样的问题。我使用的是angular2.0.0-rc4和meteorjs，我把templateUrl在我的组件…同样的错误! !我"解决"了这个问题，把整个html放在模板中，而不是templateUrl.

@Component({ selector: 'app', template : `<body> <app> You are so crazy, {{name}}!! <div> <ul> <li *ngFor="let party of parties"> {{party.name}} <p>{{party.description}}</p> <p>{{party.location}}</p> </li> </ul> </div> </app> </body>` })
我希望这个问题得到解决。

相关内容

最新更新

热门标签：