C#C
C#•4y ago
malkav

❔ Render HTML classes based on properties (Blazor)

So we managed to setup a Linq expression to get all matching tags from two lists and all. Which is awesome, but now I can't seem to render the Blazor component colors based on these properties..

Here's the Linq we managed to setup earlier:
_matchingTags.AddRange(
    User
        .Profile
        .Experiences
        .SelectMany(experience => experience.Methods).Distinct()
        .SelectMany(method =>
            Assignment.Tags.Select(tag => new MatchingTags
            {
                Tag = method,
                Matches = false
                          || tag.IndexOf(method, StringComparison.CurrentCultureIgnoreCase) >= 0
                          || method.IndexOf(tag, StringComparison.CurrentCultureIgnoreCase) >= 0
            }).Distinct()
        ).Distinct()
    );


and my issue is the following
I have a List of strings, these should be rendered as Badges in the HTML component, and then change the class "bg-..." based on the properties of another List
Basically:
List<string> Tags = new() { "Tag One", "Tag Two", "Tag Three" };
List<MatchingTag> _matchingTags = new() { new() {Tag = "Tag One", Matches = false }, new() { Tag = "Tag Two", Matches = false }, new() { Tag = "Tag Three", Matches = false } };
@foreach (string tag in Tags)
{
  <span class="badge @(/* Here is where I run into usse. See below for conditions */)">@tag</span>
}

so the conditions should be as follows (very verbose):
if any item in _matchingTags has the property Tag the same as the current iteration in the loop (tag) then it should check if the property Matching is true, if so render bg-success else bg-secondary

So what I've got so far is this:
@foreach (var tag in Tags)
{
  <span class="badge @(_matchingTags.Any(x => x.Tag == tag && x.Matching)">@tag</span>
}

but this only renders green the first item of the tags, and never all matching ones...
What am I doing wrong here?
Was this page helpful?