ASP.Net Core 2: TagHelper Part 2: Display downloaded Quotes

quote-clipart-9TpbXMnnc.pngIn Part 1 you learned how to create a simple email TagHelper for ASP.Net Core. We will expand on that project and add a TagHelper.


Step 1: Add a new class called RandomQuoteTagHelper to your web project

public class RandomQuoteTagHelper :TagHelper
{
    public override void Process(TagHelperContext context, TagHelperOutput output)
    {
        //The Html Tag will be a div
        output.TagName = "div";
 
        var html = "";
        using (var w = new WebClient())
        {
            //Get a random QUOTE
            var url = "http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1";
 
            //Convert the quote to a dynamic object so we can get the Quote text out
            dynamic quote = JsonConvert.DeserializeObject(w.DownloadString(url));
            html = quote[0].content;
        }
        //Add Html quote to the Div
        output.Content.SetHtmlContent(html);
    }
}

Step 2: Add the Tag Helper to a view

<random-quote></random-quote>

 


Here’s how it looks when run:

taghelper2.png

Advertisements

One thought on “ASP.Net Core 2: TagHelper Part 2: Display downloaded Quotes

  1. Pingback: ASP.Net Core 2: TagHelper Part 3: Custom html attributes | Xamarin and Visual Studio for Beginners

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s