WebApi Method with single value and AngularJs $http json handling

Question

I am encountering an issue and I ran out of ideas, I need some guidance towards the origin and/or the solution:

Server Side

I added the standard Microsoft Web Api Controller class "ValuesController" which looks like this:

public class ValuesController : ApiController
{              
   public string Get(int id){ return "value"; }
   ...

Client Side

In my AngularJS Controller function I have a simple get

$http({method:'GET',url: '/api/values/1'}).success(function(data){
        $scope.value  =data;
    })

The HTML looks like this:

  <input type="text" ng-model="value" />

The weird thing(the issue) is that I get: "value" in my input instead of just value (no quotes). To avoid misunderstandings, I am getting this:

Instead of this:

And of course the questions are: why?? and how do I fix it*?

*hopefully the answer will not be returning an object instead of a simple string :)

Answer 1

I have the impression that this is due to security vulnerabilities in the JSON format. In the documentation of the $http service there is section called JSON Vulnerability Protection that suggests that Angular takes a few precautions to avoid an attack.

They recommend the reading of the following article: Anatomy of a Subtle JSON Vulnerability which as far as I can see delves into a case similar to yours.

Bottom line, I think you will have to return a full JSON object and not just a string. An alternative is to make sure you are getting a JSON object, by doing

$scope.value = JSON.parse(value)