2016-07-25 3 views
0

버튼을 클릭하는 동안 '요청 전송 됨'이라는 메시지를 표시하고 싶지만 버튼 하나만 클릭하면 버튼 이름이 모두 바뀌고 있습니다. 누구든지 내게 도움을 제안 할 수 있습니다.클릭시 버튼 이름을 변경하는 방법

import { Component,OnInit} from '@angular/core'; 
import {Http, Response, Headers} from '@angular/http'; 
import {Observable} from 'rxjs/Observable'; 
import {Subject } from 'rxjs/Subject'; 
import {Control,FormBuilder,ControlGroup,Validators} from '@angular/common'; 
import { IDetails } from './pro'; 
import {GetAllList } from './service' 

@Component({ 
    templateUrl: './components/professional/professional.html', 

providers : [GetAllList] 
}) 

export class Professional implements OnInit { 
    id:number; 
    profile_id:number; 
    myText:string="Send Request"; 
    details:IDetails[]; 
    title:string = 'MY SOCIETY'; 
    constructor(private _service:GetAllList) { 

    } 
    ngOnInit(){ 
    this._service.getList() 
      .subscribe(details => this.details = details); 
    } 
    send(index):any{ 
    console.log(index); 
    if(index == index){ 
    this.myText="Request sent"; 
    } 
} 
} 

내 템플릿, 버튼을 클릭하는 동안 그러나 여기 내가 하나 개의 버튼을 클릭하면 모든 버튼 이름이 changing.Can 사람이 제안하는

라는 메시지를 표시 할
<h3 class= "head">MY SOCIETY</h3> 
    <!--<hr>--> 
    <div *ngFor="let detail of details" class = "col-sm-12"> 
    <div class="pic col-sm-1"> 
    <img height="60" width="60" [src]='detail.image'>     
    </div> 
    <div class = "col-sm-6"> 
    <div class = "fname col-sm-12"> 
     {{detail.firstname}} 
    </div> 
    <div class ="phone col-sm-12"> 
    {{detail.phone}} 
    </div> 
    <div class ="phone col-sm-12"> 

    </div> 
    </div> 

    <button (click)='send(detail.profile_id)' > {{ myText }}</button> 

    <hr class= "col-xs-12"></div> 

'전송 요청' 도와 줘.

+0

다른 버튼은 어디에 있습니까? –

답변

0

이 매우 간단합니다 - 단지 템플릿 변수로 버튼 요소를 전달합니다

send(button, index): void { 
    console.log(index); 

    button.innerHTML = "Request sent"; 
    button.disabled = true; 
} 

:
<button (click)='send(button, detail.profile_id)' #button>Send Request</button> 

그리고 구성 요소에 당신이 그것을 사용하지 어쩌면 텍스트를 설정하는 버튼에 액세스 할 수 있습니다

예를 들어, 사용에 대한

Plunker

+0

이름을 새로 고칠 때 새로 고침을 받으면 새로 고치신 후에도 안정된 상태로 유지할 수 있습니다. – MMR

+0

정확히 무엇을 의미합니까? 페이지를 새로 고침하면 전체 앱이 다시 초기화되고 물론 임시 값이 재설정됩니다. – rinukkusu

+0

부울 속성을 새로 고치면 새로 고침됩니다. 예를 들어 "요청 전송 됨"이 "요청 전송"으로 돌아갑니다. – MMR

관련 문제