Question

这是工作的掠夺者：http://plnkr.co/edit/FOJHofLSgLRB4Po5Li6B?p=preview。在单击类时，底部的相应内容会发生变化，但这是硬编码的＆amp;所以有可能让内容来自这样的服务：

export class Subjectservice {
  getClass(id : number) : any {
    if(id==15)
      return [{label:  'Science', state: false},{label:  'Computer Science', state: false},{label:  'Social science', state: false},{label:  'Environmental Studies', state: false}];
    else if (id==68) 
      return [{label: 'English', state: false},{label:  'Hindi', state: false},{label:  'Mathematics', state: false},{label:  'Science', state: false}];
    else if (id==910) 
      return [{label: 'English', state: false},{label:  'Hindi', state: false}{label:  'Social science', state: false},{label:  'Sanskrit', state: false}];
    else
    return [{label: 'English', state: false}{label:  'Pol Science', state: false},{label:  'Comp Science', state: false},{label:  'Social science', state: false}];
  }
}

Answer 1

我创建了一个小角度2应用程序，它在点击时调用服务。请参阅Github的源代码here。您可以在 app / services 文件夹和 heroes.component.ts 中看到 heroService.ts 。

存储库：https://github.com/khanstudio-github/Angular2AppASPNet/tree/master/Angular2StarterApp/Angular2StarterApp

我希望这会对你有所帮助。如果遇到问题，请随时询问。

Answer 2

创建服务类：

import {Injectable} from '@angular/core';
@Injectable()
export class SubjectService{

getClass(id:any):number
{
//write your logic here....
}
}

在AppComponent中注入服务：

    import{SubjectService} from './subject.service';
            @Component({
            selector: 'my-app',
            template:'<div>.....</div>',
            providers:[SubjectService]
            })

    export class AppComponent
    {
        constructor(private subjectSer:SubjectService)
        {
            // now subjectSer can be used as instance of your service i.e. subjectSer.getClass(1);
        }
    }

希望这会对你有所帮助。随意提出任何问题。

如何在angular2中的click事件中调用服务中的函数？

2 个答案: