2016-07-28 5 views
1

Это рабочий плункер: http://plnkr.co/edit/FOJHofLSgLRB4Po5Li6B?p=preview. При нажатии классов соответствующего содержимого в нижней части изменений, но это жёстко & так что это возможно, чтобы иметь то, что делает содержание прийти от службы, как это:Как вызвать функцию в сервисе на событие click в угловом2?

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}]; 
    } 
} 

ответ

1

У меня есть небольшое угловое приложение 2, которое вызывает службу при нажатии. Пожалуйста, смотрите исходный код here Github. Вы можете увидеть heroService.ts в app/services папка и heroes.component.ts.

Repository: https://github.com/khanstudio-github/Angular2AppASPNet/tree/master/Angular2StarterApp/Angular2StarterApp

Я надеюсь, что это поможет вам. Пожалуйста, не стесняйтесь задавать вопрос о том, стоит ли рассматривать некоторые проблемы.

+0

В моем .html У меня есть идентификатор & и его клик. Я хочу вызвать функцию в компоненте.ts, которая далее вызывает функцию в service.ts , При вызове функции из html мне также необходимо передать идентификатор карты, на основе которого будет возвращен конкретный массив из службы, поэтому мне нужно передать идентификатор, так как я не могу выполнить это ... –

+1

Является ли это рабочим плунжером того же кода, который вы принимаете? или это какая-то другая версия? Тот, который вы упомянули выше. –

+0

Это то же самое, как-то угловые материальные карты, которые я использую, не работают на плункер, поэтому классы, выделенные жирным шрифтом, вы можете считать их карточками. –

0

Создать класс обслуживания:

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); 
     } 
    } 

Надеется, что это поможет. Не стесняйтесь задавать любые вопросы.

+0

Спасибо, но я не знаю, вызывая subjectSer.getClass (id); он дает ошибку, что он не распознает «id»: [ts] Не удается найти имя «id». any –

Смежные вопросы