Blazor cannot set style property

178 Views Asked by At

cannot set the style property of an element it's always empty. When I write out StyleString it says color: red

[Transposed verbatim from the comment]

AT(StyleString = ShouldBeError ? "color: red" : "") 
</div>
 @StyleString 
<MudCard> 
  <MudCardHeader> 
    <CardHeaderContent> 
      <MudText Typo="Typo.h6" Style="AT($"{StyleString}")"> 
       //..... 

ATcode { 
//... 
private bool ShouldBeError; 
private string StyleString = ""; 
private List<Location> Data = new List<Location>(); 

enter image description here

3

There are 3 best solutions below

0
On

In MudBlazor you need to use theme Colors or Palette colors Like:

Color.Primary, Color.Secondary ...ets

for more, see this link

<MudText Typo="Typo.h6" Color="@(ShouldBeError ? Color.Primary : Color.Secondary)" > Some text </MudText>

@code {
    private bool ShouldBeError = true; 
}
1
On

I'm not a MudBlazor user, so here's a very simple example demonstrating how to set properties on any element/component. In this case the class of the button rather than the style on a component.

@page "/"

<PageTitle>Index</PageTitle>

<h1>Hello, world!</h1>

Welcome to your new app.

<div class="m-2">
    <button class="@_btnCss" @onclick="this.Change">
        Switch
    </button>
</div>

<SurveyPrompt Title="How is Blazor working for you?" />

@code {
    private bool _enabled;
    private string _btnCss => _enabled ? "btn btn-success" : "btn  btn-secondary";

    private void Change()
        => _enabled = !_enabled;
}

[Personal] Note that I try to keep component logic out of the markup whenever I can. I think it's easier to read.

0
On

I put a div above MudText and it worked straight away.