ASPNET Core HttpPost [FromBody]参数始终为null

Question

我正在学习MVC，并尝试遵循PluralSight上的教程。我尝试完全遵循作者的功能，但是在视频中，他能够添加新的stop，而我却不能，因为HttpPost方法中的binding参数始终为null。我尝试将[FromBody]切换为string类型，但仍然无法正常工作。

public class StopViewModel
{
    [Required()]
    [StringLength(100, MinimumLength = 5)]
    public string Name { get; set; }

    public double Latitude { get; set; }
    public double Longitude { get; set; }

    [Required()]
    public int Order { get; set; }

    [Required()]
    public DateTime Arrival { get; set; }
}

客户端视图布局：

 <form novalidate name="newStopForm" ng-submit="vm.addStop()">
    <div class="form-group">
        <label>Date</label>
        <input class="form-control" id="arrival" name="arrival"
               ng-model="vm.newStop.arrival"
               required
               ng-pattern="/^(\d{2})\/(\d{2})\/(\d{4})$/" />
        <span class="text-danger" ng-show="newStopForm.arrival.$error.required">Required</span>
        <span class="text-danger" ng-show="newStopForm.arrival.$error.pattern">Must be in format of MM/DD/YYYY.</span>
    </div>
    <div class="form-group">
        <label>Location</label>
        <input class="form-control" id="loc" name="loc" ng-model="vm.newStop.loc" required ng-minlength="5" />
        <span class="text-danger" ng-show="newStopForm.loc.$error.required">Required</span>
        <span class="text-danger" ng-show="newStopForm.loc.$error.minlength">Must be 5 characters or more</span>
    </div>
    <div>
        <input type="submit" value="Add" class="btn btn-success" ng-disabled="newStopForm.$invalid" />
    </div>
</form>

控制器：

这是发生空值的地方。 “ [FromBoyd]StopViewModel vm”和“ vm”始终为空。

[HttpPost("Api/Trips/{vacation}/stops")]
public async Task<IActionResult> AddNewStop(string vacation, [FromBody]StopViewModel vm)
{
    try
    {
        if (ModelState.IsValid)
        {
            var newStop = Mapper.Map<Stop>(vm);

            _vacationRepo.AddStop(vacation, User.Identity.Name, newStop);

            //now we add new stop to the database
            if (await _vacationRepo.AddToDbAsync())
            {
                return Created($"api/trips/{vacation}/stops/{newStop.Name}",
                    Mapper.Map<StopViewModel>(newStop));
            }
        }
        else
        {
            foreach (var modelStateKey in ViewData.ModelState.Keys)
            {
                var modelStateVal = ViewData.ModelState[modelStateKey];
                foreach (var error in modelStateVal.Errors)
                {
                    var key = modelStateKey;
                    var errorMessage = error.ErrorMessage;
                    var exception = error.Exception;
                }
            }
        }
    }
    catch(Exception err)
    {
        string info = err.Message;
    }

    return BadRequest("Post- Bad things happened");
}

已更新： 添加JavaScript文件。

    (function () {
    //getting the existing module
    angular.module("app-trips")
        .controller("tripsEditorController", tripsEditorController);

    function tripsEditorController($routeParams, $http) {
        var vm = this;

        vm.tripName = $routeParams.tripName;
        vm.stops = [];
        vm.errorMessage = "Dummy Error";
        vm.newStop = [];

        var url = "/Api/Trips/" + vm.tripName + "/Stops";

        $http.get(url)
            //$http({ method: "GET", url: url })
            .then(function (response) {
                //success
                angular.copy(response.data, vm.stops);

                _showMap(vm.stops);
            }, function (error) {
                //failure
                vm.errorMessage = "Failed to load stops: " + error;
            });

        vm.addStop = function () {
            //vm.errorMessage = "inside addStop";
            $http.post(url, vm.newStop)
                .then(function (response) {
                    //success
                    //vm.stops.push(response.data);
                    angular.push(response.data);

                    _showMap(vm.stops);

                    vm.newStop = {};
                }, function (error) {
                    //failure
                    vm.errorMessage = "Failed to add new stop";
                });
        }
    }

    function _showMap(stops) {
        if (stops && stops.length > 0) {

            var mapStops = _.map(stops, function (item) {
                return {
                    lat: item.latitude,
                    long: item.longitude,
                    info: item.name
                };
            });

            //show map
            travelMap.createMap({
                stops: mapStops,
                selector: "#map",
                currentStop: 1,
                initialZoom: 3
            });
        }
    }
})();