.razor 에서 foreach를 사용하여 생성한 버튼에 @onclick을 썼을때...

 

오늘 PLC 모니터링 기능을 추가하면서 웹 테스트를 하는데... 

이상한 현상이???

 

.razor 안에서 ... 

@code{
	MonitoringInfo info = null;
}


@foreach( var brd in bridges ) {
    info = Service.GetMonitoringInfo( brd );
	
    <div ... >
    	<button @onclick=( e => EditDangerConfirm( info.ID, info.DangerValue) ) >
    </div>
    
}

 

이런 식으로 썼는데 bridges를 순회하면서 html코드를 생성하고 

@onclick 이벤트에 연결 했는데... 

 

화면에서 테스트를 해보니... 무조건 마지막에 연결되었던 객체 정보로 뜬다. 

원인 ::

@onclick이 발생하는 때에는 데이타가 계속 덮어씌여져서 가장 마지막 요소를 가지고 오픈하니까 ... 엉뚱한게 보여진다. 

구글링을 해보니... 저렇게 쓰면 안된단다.. 생각해보니.. 그게 맞는 것도 같고..

 

해결방법 :: 

@foreach( var brd in bridges ) {
    MonitoringInfo info = Service.GetMonitoringInfo( brd );
	
    <div ... >
    	<button @onclick=( e => EditDangerConfirm( info.ID, info.DangerValue) ) >
    </div>
    
}

 

독립변수가 되겠끔. 

   MonitoringInfo info ; 선언을 foreach 안쪽으로 내렸다.

이렇게 하면 @onclick되는 시점에 바인딩될때의 변수값들을 가지고 컨펌창이 뜬다.