我在ASP.NET MVC中使用angular 2。
这是"其他"成分:
import { Component } from '@angular/core';
@Component({
selector: 'other-app',
templateUrl: './app/other/other.component'
})
export class OtherComponent {
name = "kianoush";
}
这是我的app.module:
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { OtherComponent } from './other/other.component';
@NgModule({
imports: [BrowserModule],
declarations: [
AppComponent,
OtherComponent
],
bootstrap: [AppComponent]
})
export class AppModule { }
和这个app.component:
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
template: `<h1>My Name is {{name}}</h1>
<other-app></other-app>`
})
export class AppComponent {
name = "Kianoush";
}
这是我项目的文件夹:
但是当我运行项目时,它会在控制台中显示错误:
这是HTML:
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
<link href="~/Content/Site.css" rel="stylesheet" type="text/css" />
<link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="~/Scripts/modernizr-2.6.2.js"></script>
<script src="/node_modules/core-js/client/shim.min.js"></script>
<script src="/node_modules/zone.js/dist/zone.js"></script>
<script src="/node_modules/reflect-metadata/Reflect.js"></script>
<script src="/node_modules/systemjs/dist/system.src.js"></script>
<script src="/systemjs.config.js"></script>
<base href="/">
<script>
System.import('app').catch(function(err){ console.error(err); });
</script>
答案 0 :(得分:0)
是wwwroot中的模板吗?
您无法访问文件系统的任何部分,这是设计使然。如果您只想通过请求URL来提供模板,请将其放在wwwroot中的正确位置。
如果您想通过MVC的控制器系统发回模板,您需要确保路线
有一个关联的控制器方法来处理它。这应该是一个视图控制器方法,它返回模板的视图。