1

Below is my Angular js Front end Code 

app.controller("assetController", ['$scope', '$http', function ($scope, $http) {

    $scope.submit = function () {

        var book = {
            "Name": $scope.name,
            "Isbn": $scope.isbn,
            "Publisher": $scope.publisher,
            "Edition":$scope.edition
        }


        $http.post("http://localhost:51227/api/Asset", book)
            .then(function(data, status) {
                $scope.name = book.Name;
                $scope.isbn = book.Isbn;
                $scope.publisher = book.Publisher;
                $scope.edition=book.Edition;

                alert("product added successfully. " + status);
            })
            .catch(function(response) {
                console.log('Exception Caught', response.status, response.data);
            })
            .finally(function() {
            });
    }

This is my webApi Controller

  public void Post([FromBody] AssetViewModel model)
    {
        if ( model is BookViewModel)
        {
            BookViewModel bookViewModel = (BookViewModel)model;
            AssetViewModel assetViewModel = new BookViewModel
            {
                Name = bookViewModel.Name,
                Category = bookViewModel.Category,
                Edition = bookViewModel.Edition,
                Isbn = bookViewModel.Isbn,
                Publisher = bookViewModel.Publisher
            };
            _assetAssetRepository.SaveAsset(Mapper.Map<Book>(assetViewModel));
        }

    }

Below are the Two ViewModel Classes

public class AssetViewModel
{
    public string Name { get; set; }        
}

public class BookViewModel:AssetViewModel
{

    public string Isbn { get; set; }
    public string Edition { get; set; }
    public string Publisher { get; set; }
    public string Category { get; set; }

}

So basically this is a simple Angular js Code that makes a call to WebAPI Controller and passes Book Object ( or the BookViewModel). The Parameter for the WebApi is AssetViewModel (BaseClass) but its ok because we should be able to pass in BookViewModel(Derived Class) at runtime. The Angular Front End passes Book Object but when i check in the webapi controller it shows up as a parent class i.e. Asset. Therefore i cannot retrive the fields associated with Book Class. Could someone please show me the right way?

Sike12
  • 1,232
  • 6
  • 28
  • 53
  • 1
    You're going to have to have an action that accepts a `BookViewModel` as a parameter. – Jasen Jan 09 '16 at 21:43
  • Thank you @Jasen I know thats one of the solution. However this would not work well if we end of having several derived view models. such as AudioViewModel, VideoViewModel and so on. Would be a effective solution to add action for each of the derived models we add? i believe we should be coding against the base types, abstract classes or interfaces rather than concrete or derived classes. – Sike12 Jan 09 '16 at 21:50
  • 1
    Thats occur because the _Model Binding_ stage, so when you send a request it will map the form or json in the body to the parameter type of the action, so you need to put the disere type to bind it, or make your own model binder that will decide what type is, see here how http://www.asp.net/web-api/overview/formats-and-model-binding/parameter-binding-in-aspnet-web-api , – Joel R Michaliszen Jan 09 '16 at 22:01
  • 2
    I believe [this](http://stackoverflow.com/a/12641541/2030565) will help you accomplish what you are trying to do. – Jasen Jan 09 '16 at 22:17
  • Thank you @Jasen i will look into your answer and the link – Sike12 Jan 10 '16 at 11:25
  • Thank you @JoelRamosMichaliszen i will look into your answer and the link – Sike12 Jan 10 '16 at 11:25

0 Answers0