вернуть viewmodel как модель из контроллера в view и получить с помощью angularjs и показать в теге option в Asp.Net Ядро 3.1?

#javascript #c# #angularjs #asp.net-core

#javascript #c# #angularjs #asp.net-ядро

Вопрос:

У меня есть код в поле зрения, подобный этому :

 $scope.Fields = [];
$scope.showform = function (id) {
    $http.get("/GetCategoryNameById?catid="   id)
        .then(function (response) {
           
            $scope.Fields = response.data;
            

        });

}
 

и на контроллере :

  public IActionResult GetCategoryNameById(AdvertComplexViewModel fieldslist, int catid)
    {           

        var category = _scopeContext.GetCategoryName(catid);
        fieldslist.CategoryFieldsList = _advert.ShowCategoryFields(catid);

        return Ok($"{fieldslist.CategoryFieldsList}");
    }
 

ViewModel :

 public class AdvertComplexViewModel
{     

    public IEnumerable<CategoryField> CategoryFieldsList { get; set; }
}
 

это мой запрос :

  public List<CategoryField> ShowCategoryFields(int id)
    {
        return _context.CategoryFields.Where(c => c.CategoryId == 
        id).ToList();
    }
 

итак, я хочу передать «категорию» и «список полей».CategoryFieldsList’ как модель для просмотра и отображения в тегах опций?
как это можно сделать?

Комментарии:

1. Привет, @AliKhansari, не могли бы вы, пожалуйста, поделиться дизайном модели? И каков результат вашей категории и списка полей. Список полей категорий?

2. category resualt просто отображает название категории и fieldslist.CategoryFieldsList поля для отправки в том же category….so Я отредактировал свой вопрос и добавил viewmodel

3. Привет @AliKhansari, проверьте мой обновленный ответ. Если мой ответ поможет вам решить вашу проблему, не могли бы вы принять его в качестве ответа? Если нет, не могли бы вы продолжить, чтобы сообщить мне об этом? См.: Как принять в качестве ответа . Спасибо.

Ответ №1:

Вот простая демонстрация того, как отображать данные в теге option:

Вид:

 <div ng-app="myApp" ng-controller="Home">
    <button class="btn btn-primary" ng-click="showform()">Create Account</button>

    <select name="Category">
        <option value="undefined">Please select Value</option>
        <option ng-repeat="option in Fields" value="{{option.id}}">{{option.name}}</option>
    </select>       
</div>

@section Scripts
{
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<script>
    
    var app = angular.module('myApp', []);
    app.controller('Home', function ($scope, $http) {
        $scope.Fields = [];

        $scope.showform  = function (id) {

            $http.get("/GetCategoryNameById?catid="   id)
                .then(function (response) {
                    $scope.Fields = response.data;

                    console.log($scope.Fields);
                });
        };
               
    });       
</script>
}
 

Контроллер:

 public IActionResult GetCategoryNameById(int catid)
{

    var category = new AdvertComplexViewModel()
    {
        CategoryFieldsList = new List<CategoryField>()
        {
            new CategoryField(){Id=1,Name="aaa"},
            new CategoryField(){Id=2,Name="bbb"},
            new CategoryField(){Id=3,Name="ccc"}
        }
    };

    return Ok(category.CategoryFieldsList);
}
 

Результат:
введите описание изображения здесь

Комментарии:

1. Привет, у вас есть $scope.showform в вашем angularjs, поэтому вам нужна кнопка для его запуска. Вам нужно нажать кнопку, чтобы вызвать серверный API для отображения данных.

2. У меня есть кнопка, и идентификатор отправляется на контроллер. Когда я использую {{Fields}} переменную, эта ошибка отображается System.Collections.Generic.List 1[ComputerShop.dataLayer. Сущности. Поле категории]`

3. Пожалуйста, установите точку останова, чтобы проверить, есть ли у серверной части данные.. Или вы могли бы добавить console.log($scope.Fields); after $scope.Fields = response.data; , чтобы проверить данные из api.

4. Что? В вашей модели это тип IEnumerable<CategoryField> . Пожалуйста, поделитесь console.log($scope.Fields); им в своем браузере.

5. покажите это в консоли System.Collections.Generic.List 1 [ComputerShop.dataLayer. Сущности. Поле категории]`