Call .net core controller get method with an object from angular2

I'm a tad confused on what is the goal here. I see two possible api url possibilities here.

Number 1:

api/RocheClinicalTrial?searchCriteria=yourSearchCriteria

For this, the current sample "should" work. But you need to use just one action and make sure the query parameter searchCriteria is not null or empty.

namespace RocheClinicalTrial.Controllers
{
    [AllowAnonymous]
    [Route("api/[controller]")]
    public class RocheClinicalTrialController : Controller
    {
        // GET: api/values
        [HttpGet]
        public JsonResult Get(string searchCriteria)
        {
            if (string.IsNullOrWhiteSpace(searchCriteria))
            {
                var repo = new Repository.Repository();
                var data = repo.GetData();

                return Json(data);
            }
            // Return back full payload.
        }
    }
}

Number 2: The one that was intended in the Angular 2 component

api/RocheClinicalTrial/yourSearchCriteria

Something like the following would be sufficient

namespace RocheClinicalTrial.Controllers
{
    [AllowAnonymous]
    [Route("api/[controller]")]
    public class RocheClinicalTrialController : Controller
    {
        // GET: api/values
        [HttpGet]
        public JsonResult Get()
        {
            var repo = new Repository.Repository();
            var data = repo.GetData();

            return Json(data);
        }

        [HttpGet("{searchCriteria}")]
        public string Get(string searchCriteria)
        {
            System.Console.WriteLine(searchCriteria);
            return "value";
        }
    }
}

Now, a gentle reminder here. A url length is finite, according to IE it is 2,083 characters. It might roam around the same region for other browsers and clients.

To send back a proper json payload, it is always better to use a POST.

Something like the following would be of use then:

namespace TestApp.Controllers
{
    [Route("api/[controller]")]
    public class ValuesController : Controller
    {
        [HttpGet]
        public JsonResult Get()
        {
            var data = "I'm the default one";
            return Json(data);
        }

        [HttpPost]
        public IActionResult Get([FromBody] SearchCriteria searchCriteria)
        {
            return new ObjectResult(searchCriteria);
        }
    }
}

A sample post request from Angular 2 would be:

  public search() {
        let headers = new Headers({ 'Content-Type': 'application/json' });
        let options = new RequestOptions({ headers: headers });

        let searchCrit = this.searchCriteria; 
        this.http.post('/api/RocheClinicalTrial/', searchCrit, options)
             .subscribe(result => {
                 console.log(result);
             });

    }

if you want to bind the search criteria then modify your api url so it looks like this :

api/RocheClinicalTrial?searchCriteria=yourSearchCriteria

you need to do this if you haven't specified an MVC route to match this. so basically the extra paramater matches the same thing on the MVC side and then the MVC engine can automatically map that value for you.

It also means you will have to URL encode your search string otherwise you might have an invalid URL.

If I were you I would not use a GET for this method, use a POST and pass the data inside it. Don't forget URLs have a character limit so you can't make them too long

I have found a solution.

Here is my call from client side:

    this.http.get('/api/RocheClinicalTrial/Details/' + this.searchCriteria).subscribe(result => {
        //this.searchList = result.json();
        console.log(result);
    });

Here is my controller:

namespace RocheClinicalTrial.Controllers
{
    [AllowAnonymous]
    [Route("api/RocheClinicalTrial")]
    public class RocheClinicalTrialController : Controller
    {
        // GET: api/values
        [HttpGet]
        public JsonResult Get()
        {
            var repo = new Repository.Repository();
            var data = repo.GetData();

            return Json(data);
        }

        [Route("Details/{ItemName}")]
        //GET api/values/5
        [HttpGet("api/values")]
        public string Get(SearchCriteria searchCriteria)
        {
            System.Console.WriteLine(searchCriteria);
            return "value";
        }
}
}