데이터베이스에 작업을 저장하고 있습니다. 각 작업은 해결되거나 열릴 수 있으므로 상태에 따라 true
또는 false
을 포함하는 열 isSolved
을 DB에 만들었습니다.데이터베이스 값에 따라 행 색상 변경
이제 모든 작업 목록을 표시하고 해결 된 작업의 행의 배경색을 녹색으로, 그리고 해결되지 않은 작업을 빨간색으로 설정하고 싶습니다. 그러나 .cshtml
파일 내부에서 어떻게 알 수 있습니까?
데이터베이스에 작업을 저장하고 있습니다. 각 작업은 해결되거나 열릴 수 있으므로 상태에 따라 true
또는 false
을 포함하는 열 isSolved
을 DB에 만들었습니다.데이터베이스 값에 따라 행 색상 변경
이제 모든 작업 목록을 표시하고 해결 된 작업의 행의 배경색을 녹색으로, 그리고 해결되지 않은 작업을 빨간색으로 설정하고 싶습니다. 그러나 .cshtml
파일 내부에서 어떻게 알 수 있습니까?
당신은 뷰 내부의 조건 검사를 수행 할 @()
을 사용할 수 있습니다 : 물론 당신은 CSS 규칙이있다.
<ul>
@foreach(var task in Model) // Model is your list of tasks
{
<li class="@(task.isSolved ? "solved" : "unsolved")">@task.Description</li>
}
<ul>
CSS
li.solved
{
color: green;
}
li.unsolved
{
color: red;
}
상태에 따라 각 요소에 클래스를 추가하십시오.
<ul>
@foreach(var task in Model.Tasks)
{
<li class="@task.Color" >text</li>
}
<ul>
귀하의 TaskVM.Color
재산권이 될 것을
public string Color
{
get { return isSolved ? "Green" : "Red"; }
}
와의
처럼 : 당신은 (내가ul
태그를 사용하지만 다른 태그로 작동) 주 VM에있는
TaskVM
목록을 렌더링하는 가정
.Green {
background-color:#33CC00;
}
.Red {
background-color:#FF333;
}