Angularjs 异常：在angular2应用程序中的RiskService上未找到指令注释
我正试图在VisualStudio2015应用程序中使用typescript构建angular 2应用程序。我使用的是角度释放候选1 我已经创建了一个risk.service组件，它将向我的视图提供数据。但是，在运行应用程序时，我在浏览器的控制台中收到以下错误消息 异常：在RiskService上找不到指令批注 我的文件夹结构 风险.服务.tsAngularjs 异常：在angular2应用程序中的RiskService上未找到指令注释,angularjs,angular,Angularjs,Angular,我正试图在VisualStudio2015应用程序中使用typescript构建angular 2应用程序。我使用的是角度释放候选1 我已经创建了一个risk.service组件，它将向我的视图提供数据。但是，在运行应用程序时，我在浏览器的控制台中收到以下错误消息 异常：在RiskService上找不到指令批注 我的文件夹结构 风险.服务.ts import { Injectable } from '@angular/core'; import { IRisk } from './risk';
import { Injectable } from '@angular/core';
import { IRisk } from './risk';
import { Component } from '@angular/core';
@Injectable()
export class RiskService {
getRisks(): IRisk[] {
return [
{
"riskId": 1,
"reference": "HISC9308336",
"insuredName": "SA 84161",
"inceptionDate": "March 19, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 100,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 2,
"reference": "HISC9308340",
"insuredName": "Upper Loi",
"inceptionDate": "April 25, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 312.22,
"allocatedTo": "Andy Marples",
"allocatedCompany": "Broker"
},
{
"riskId": 3,
"reference": "HISC9308342",
"insuredName": "Test",
"inceptionDate": "April 28, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 312.2,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 4,
"reference": "HISC9308344",
"insuredName": "Test",
"inceptionDate": "April 29, 2016",
"riskType": "Quote",
"status": "Quoted",
"grossPremium": 444.12,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 5,
"reference": "HISC9308345",
"insuredName": "Test",
"inceptionDate": "May 02, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 423.82,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
}
,
{
"riskId": 6,
"reference": "HISC9308340",
"insuredName": "Upper Loi",
"inceptionDate": "April 25, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 312.22,
"allocatedTo": "Andy Marples",
"allocatedCompany": "Broker"
},
{
"riskId": 7,
"reference": "HISC9308342",
"insuredName": "Test",
"inceptionDate": "April 28, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 312.22,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 8,
"reference": "HISC9308344",
"insuredName": "Test",
"inceptionDate": "April 29, 2016",
"riskType": "Quote",
"status": "Quoted",
"grossPremium": 444.12,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 9,
"reference": "HISC9308345",
"insuredName": "Test",
"inceptionDate": "May 02, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 423.82,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
}
];
}
}
import { Component, OnInit } from '@angular/core';
import { IRisk } from './risk';
import { RiskService } from './risk.service';
import { DataTable, Column } from 'primeng/primeng';
import {Header} from 'primeng/primeng';
import {Footer} from 'primeng/primeng';
import {Paginator} from 'primeng/primeng';
@Component({
selector: 'rm-risks',
directives: [DataTable, Column, Header, Footer, Paginator, RiskService],
templateUrl: '/app/components/risks/risk-list.component.html'
})
export class RiskListComponent implements OnInit {
pageTitle: string = 'Risk List';
risks: IRisk[];
constructor(private _riskService: RiskService) {
}
ngOnInit(): void {
this.risks = this._riskService.getRisks();
}
};
import { Component } from '@angular/core';
import { RiskListComponent } from './components/risks/risk-list.component';
import { DataTable, Column } from 'primeng/primeng';
import { RiskService } from './components/risks/risk.service';
@Component({
selector: 'my-app',
providers: [RiskService],
template: `
<div>
<h1>{{pageTitle}}</h1>
<rm-risks> </rm-risks>
</div>
` ,
directives: [RiskListComponent, DataTable, Column]
})
export class AppComponent {
pageTitle: string = 'Test UK Trader';
}
import { Injectable } from '@angular/core';
import { IRisk } from './risk';
import { Component } from '@angular/core';
@Injectable()
export class RiskService {
getRisks(): IRisk[] {
return [
{
"riskId": 1,
"reference": "HISC9308336",
"insuredName": "SA 84161",
"inceptionDate": "March 19, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 100,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 2,
"reference": "HISC9308340",
"insuredName": "Upper Loi",
"inceptionDate": "April 25, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 312.22,
"allocatedTo": "Andy Marples",
"allocatedCompany": "Broker"
},
{
"riskId": 3,
"reference": "HISC9308342",
"insuredName": "Test",
"inceptionDate": "April 28, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 312.2,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 4,
"reference": "HISC9308344",
"insuredName": "Test",
"inceptionDate": "April 29, 2016",
"riskType": "Quote",
"status": "Quoted",
"grossPremium": 444.12,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 5,
"reference": "HISC9308345",
"insuredName": "Test",
"inceptionDate": "May 02, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 423.82,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
}
,
{
"riskId": 6,
"reference": "HISC9308340",
"insuredName": "Upper Loi",
"inceptionDate": "April 25, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 312.22,
"allocatedTo": "Andy Marples",
"allocatedCompany": "Broker"
},
{
"riskId": 7,
"reference": "HISC9308342",
"insuredName": "Test",
"inceptionDate": "April 28, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 312.22,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 8,
"reference": "HISC9308344",
"insuredName": "Test",
"inceptionDate": "April 29, 2016",
"riskType": "Quote",
"status": "Quoted",
"grossPremium": 444.12,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 9,
"reference": "HISC9308345",
"insuredName": "Test",
"inceptionDate": "May 02, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 423.82,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
}
];
}
}
import { Component, OnInit } from '@angular/core';
import { IRisk } from './risk';
import { RiskService } from './risk.service';
import { DataTable, Column } from 'primeng/primeng';
import {Header} from 'primeng/primeng';
import {Footer} from 'primeng/primeng';
import {Paginator} from 'primeng/primeng';
@Component({
selector: 'rm-risks',
directives: [DataTable, Column, Header, Footer, Paginator, RiskService],
templateUrl: '/app/components/risks/risk-list.component.html'
})
export class RiskListComponent implements OnInit {
pageTitle: string = 'Risk List';
risks: IRisk[];
constructor(private _riskService: RiskService) {
}
ngOnInit(): void {
this.risks = this._riskService.getRisks();
}
};
import { Component } from '@angular/core';
import { RiskListComponent } from './components/risks/risk-list.component';
import { DataTable, Column } from 'primeng/primeng';
import { RiskService } from './components/risks/risk.service';
@Component({
selector: 'my-app',
providers: [RiskService],
template: `
<div>
<h1>{{pageTitle}}</h1>
<rm-risks> </rm-risks>
</div>
` ,
directives: [RiskListComponent, DataTable, Column]
})
export class AppComponent {
pageTitle: string = 'Test UK Trader';
}
import { Injectable } from '@angular/core';
import { IRisk } from './risk';
import { Component } from '@angular/core';
@Injectable()
export class RiskService {
getRisks(): IRisk[] {
return [
{
"riskId": 1,
"reference": "HISC9308336",
"insuredName": "SA 84161",
"inceptionDate": "March 19, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 100,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 2,
"reference": "HISC9308340",
"insuredName": "Upper Loi",
"inceptionDate": "April 25, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 312.22,
"allocatedTo": "Andy Marples",
"allocatedCompany": "Broker"
},
{
"riskId": 3,
"reference": "HISC9308342",
"insuredName": "Test",
"inceptionDate": "April 28, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 312.2,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 4,
"reference": "HISC9308344",
"insuredName": "Test",
"inceptionDate": "April 29, 2016",
"riskType": "Quote",
"status": "Quoted",
"grossPremium": 444.12,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 5,
"reference": "HISC9308345",
"insuredName": "Test",
"inceptionDate": "May 02, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 423.82,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
}
,
{
"riskId": 6,
"reference": "HISC9308340",
"insuredName": "Upper Loi",
"inceptionDate": "April 25, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 312.22,
"allocatedTo": "Andy Marples",
"allocatedCompany": "Broker"
},
{
"riskId": 7,
"reference": "HISC9308342",
"insuredName": "Test",
"inceptionDate": "April 28, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 312.22,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 8,
"reference": "HISC9308344",
"insuredName": "Test",
"inceptionDate": "April 29, 2016",
"riskType": "Quote",
"status": "Quoted",
"grossPremium": 444.12,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
},
{
"riskId": 9,
"reference": "HISC9308345",
"insuredName": "Test",
"inceptionDate": "May 02, 2016",
"riskType": "Quote",
"status": "Indication",
"grossPremium": 423.82,
"allocatedTo": "Broker User",
"allocatedCompany": "Broker"
}
];
}
}
import { Component, OnInit } from '@angular/core';
import { IRisk } from './risk';
import { RiskService } from './risk.service';
import { DataTable, Column } from 'primeng/primeng';
import {Header} from 'primeng/primeng';
import {Footer} from 'primeng/primeng';
import {Paginator} from 'primeng/primeng';
@Component({
selector: 'rm-risks',
directives: [DataTable, Column, Header, Footer, Paginator, RiskService],
templateUrl: '/app/components/risks/risk-list.component.html'
})
export class RiskListComponent implements OnInit {
pageTitle: string = 'Risk List';
risks: IRisk[];
constructor(private _riskService: RiskService) {
}
ngOnInit(): void {
this.risks = this._riskService.getRisks();
}
};
import { Component } from '@angular/core';
import { RiskListComponent } from './components/risks/risk-list.component';
import { DataTable, Column } from 'primeng/primeng';
import { RiskService } from './components/risks/risk.service';
@Component({
selector: 'my-app',
providers: [RiskService],
template: `
<div>
<h1>{{pageTitle}}</h1>
<rm-risks> </rm-risks>
</div>
` ,
directives: [RiskListComponent, DataTable, Column]
})
export class AppComponent {
pageTitle: string = 'Test UK Trader';
}
从'@angular/core'导入{Component}；
从“./components/risks/risk list.component”导入{RiskListComponent}；
从'priming/priming'导入{DataTable，Column}；
从“./components/risks/risk.service”导入{RiskService}；
@组成部分({
选择器：“我的应用程序”，
提供者：[风险服务]，
模板：`
{{pageTitle}}
` ,
指令：[RiskListComponent，DataTable，Column]
})
导出类AppComponent{
pageTitle:string='测试英国交易员'；
}
directives: [DataTable, Column, Header, Footer, Paginator, **RiskService**]
import { RiskService } from './risk.service';
directives: [DataTable, Column, Header, Footer, Paginator]
providers: [RiskService]
在risk-list.component.ts中 由于RiskService不是指令，因此不应在此列出：
directives: [DataTable, Column, Header, Footer, Paginator, **RiskService**]
import { RiskService } from './risk.service';
directives: [DataTable, Column, Header, Footer, Paginator]
providers: [RiskService]
您应该将您的服务定义到组件的
providers@Component({
selector: 'rm-risks',
directives: [DataTable, Column, Header, Footer, Paginator],
providers: [RiskService],
templateUrl: '/app/components/risks/risk-list.component.html'
})
export class RiskListComponent implements OnInit {
(...)
}
bootstrap(AppComponent, [RiskService]);
您应该将您的服务定义到组件的
providers@Component({
selector: 'rm-risks',
directives: [DataTable, Column, Header, Footer, Paginator],
providers: [RiskService],
templateUrl: '/app/components/risks/risk-list.component.html'
})
export class RiskListComponent implements OnInit {
(...)
}
bootstrap(AppComponent, [RiskService]);
从标头中删除RiskService后，仍然会出现相同的错误。另外，我在编写您给我的导入语句时出错。它不接受这条路径。它接受path./risk.service。我可能会这样想，因为服务位于risks文件夹下，该文件夹也是服务文件的根目录。但我似乎仍然有我在上面的帖子中提到的相同的例外，这是正确的，我编辑了服务路径。。您使用的是angular的哪个版本？angular 2发行候选1您试用过这个吗？从“/risk.service”导入{RiskService}；指令：[DataTable、Column、Header、Footer、Paginator]提供者：[RiskService]感谢Som指出缺少的代码。基本上，我没有在Package.json文件中添加“@angular/http”：“2.0.0-rc.1”。在main.ts中还包括以下内容，其中我引导我的角度组件从'@angular/HTTP'导入{HTTP_PROVIDERS}；引导（AppComponent，[HTTP_提供者，RiskService]）.catch（err=>console.error（err））；从标头中删除RiskService后，仍然会出现相同的错误。另外，我在编写您给我的导入语句时出错。它不接受这条路径。它接受path./risk.service。我可能会这样想，因为服务位于risks文件夹下，该文件夹也是服务文件的根目录。但我似乎仍然有我在上面的帖子中提到的相同的例外，这是正确的，我编辑了服务路径。。您使用的是angular的哪个版本？angular 2发行候选1您试用过这个吗？从“/risk.service”导入{RiskService}；指令：[DataTable、Column、Header、Footer、Paginator]提供者：[RiskService]感谢Som指出缺少的代码。基本上，我没有在Package.json文件中添加“@angular/http”：“2.0.0-rc.1”。在main.ts中还包括以下内容，其中我引导我的角度组件从'@angular/HTTP'导入{HTTP_PROVIDERS}；引导（AppComponent，[HTTP_提供者，RiskService]）.catch（err=>console.error（err））；我已经在我的app.component类的provider属性中指定了该服务。这是我的应用程序根组件，因此您无需再次指定它。。。通过简单地从组件的
指令指令