0

저는 Angularjs UI 그리드를 사용하고 있습니다. 셀 템플릿 렌더링에 작은 도움이 필요합니다. 각 행에서 첫 번째 열은 셀 값에 따라 진행률 막대를 표시해야합니다.Angularjs ui grid 셀 템플릿 템플릿 렌더링에서 셀 값을 사용해야합니다.

var ctrl = this; 

    ctrl.gridOptions = {}; 

ctrl.gridOptions.columnDefs = [{ 
     field: 'completeStatus', 
     cellTemplate: ' <uib-progressbar value="55"> </uib-progressbar>', 
     width: 100 
    }, 

    { 
     field: 'invoiceNum' 
    } 
]; 

ctrl.gridOptions.data = [{ 
    "completeStatus": "70", 

    "invoiceNum": "2332324" 
}, { 
    "completeStatus": "50", 

    "invoiceNum": "1221123" 
}, { 
    "completeStatus": "20", 

    "invoiceNum": "-" 
}]; 

HTML : 위의 설정을 위해 잘 작동

<div id="regGrid" ui-grid="ctrl.gridOptions" class="reg-grid"></div> 

내가 사용한 UI 부트 스트랩 진행 표시 줄 그래서 내 컨트롤러에서 다음을 사용했다. 그러나 각각의 모든 진행 표시 줄은 값을 하드 코드했기 때문에 55%으로 표시됩니다. 이제 "completeStatus"필드의 값에 따라 진행률 막대 값을 변경하고 싶습니다. 그래서 cellTempalate

cellTemplate: '<span> '+ completeStatus +' </span> <uib-progressbar value='+ completeStatus + '> </uib-progressbar>' 

을 변경 한 그러나 그것은 작동하지 않습니다. 진행률 표시 줄에 셀 값을 사용하고 해당 값을 범위에 표시하려고합니다. 어느 누구도이 문제를 해결할 수 있습니까?

답변

1

이 시도 :

<span>{{row.entity.completeStatus}}</span> <uib-progressbar value='row.entity.completeStatus'></uib-progressbar>

당신이 completeStatus 속성이 행의 객체를 보간 UI 그리드를 말하는거야 이런 식으로.