Как передать справочные данные из контроллера C # в модель представления с выбыванием, чтобы он мог преобразовать идентификатор в свое текстовое значение

Question

У меня есть классы c #, которые нужно передать в модель представления с выбыванием для целей поиска. Показывать статус пользователя 1000 или роль 14038 бесполезно.

Мне нужно разрешить эти значения в их текстовом представлении.

У меня есть некоторые "справочные данные", заполненные в базе данных. Кроме того, есть некоторые преобразования T4, которые переводят справочные данные в код C #, например:

public static class UserStatus
    {
        #region Members
        public const string ClassName = "UserStatus";

        public const int Pending = 1000;
        public const int Active = 1001;
        public const int Inactive = 1002;
        public const int Deleted = 1003;

        #endregion
    }

Этот класс затем используется во всем коде для присвоения значений классу User, вместо того, чтобы говорить user.UserStatus = 1000, это user.UserStatus = UserStatus.Pending.

Теперь к вопросу ...

ТЕКУЩИЙ ВЫПУСК

У меня есть страница со списком пользователей в системе, и один из столбцов в списке - это статус пользователя. Хорошо, что статус, переданный в объекте, равен 1000, а не «Ожидание». То, что я хотел бы сделать, это иметь возможность восстановить 1000 в «Ожидание» в нокауте. Проблема в том, что нокаут выполняется на стороне клиента, он не знает моих классов C #. В идеале я хотел бы иметь возможность предварительно заполнить список в моем контроллере возможными значениями UserStatus, передать его в мою модель представления выбивки, сделать так, чтобы он просматривал возможные состояния и разрешал его на основе этого конкретного статуса пользователя.

HTML-код

            <tbody style="display: none;" class="table-body" data-bind="visible: true, foreach: { data: viewData.ClientGroups, as: 'ClientGroup' }">
                <tr>
                    <td><a href="#" data-bind="click: ClientGroup.viewDetails"><span data-bind="html: ClientGroup.Name()"></span></a></td>
                    <td>TODO: Bind Client</td>
                    <td><span data-bind="html: ClientGroup.StatusText()"></span></td>
                    <td><span data-bind="html: ClientGroup.CreatedOnText()"></span></td>
                </tr>
            </tbody>

Создание и привязка модели вида нокаута.

    var viewData = {};
    require(['main'], function () {
        require(['message', 'viewModel/clientGroupViewModel', 'viewModel/clientGroupDetailsViewModel'],
            function (message, clientGroupViewModel, clientGroupDetailsViewModel) {
                $(document).ready(function () {
                    // enable ko punches
                    ko.punches.enableAll();

                    var json = @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model, Newtonsoft.Json.Formatting.None, new IHtmlStringConverter()));

                    // I'd like to be able to create something here and pass it to my model.
                    var lookupValues = { blah }

                    viewData = new clientGroupViewModel(json, lookupValues);
                    var zdm = new clientGroupDetailsViewModel(json, lookupValues );

                    ko.applyBindings(viewData, document.getElementById('clientGroupAdmin'));
                    ko.applyBindings(zdm, document.getElementById('detailsModal'));
                });
        });
    });

В нокаут-модели

   _self.StatusText = ko.computed(function () {
            console.log('user status');
            if (ko.utils.arrayFirst(UserStatus, function (value) {
                console.log(value);
                return value.Id == _self.UserStatus();
            }));
            return 'false';
        });

Answer 1

Пожалуйста, прочитайте мои дополнительные информационные вопросы, но это один из способов, как я могу это сделать ..

console.clear();

var $fakeAsync = function (api, result) {
    var isEmptyCall = _.isNull(api) || api.length === 0;
    dfd = $.Deferred(function () {
        setTimeout(function () {
            dfd.resolve(isEmptyCall ? null : result);
        }, isEmptyCall ? 0 : 50);
    });
    return dfd.promise();
};
var $fakeData = [
	{Id: 1, Name: 'foo', UserStatus: 1000},
  {Id: 2, Name: 'bar', UserStatus: 1001},
  {Id: 3, Name: 'stack', UserStatus: 1000},
  {Id: 4, Name: 'overflow', UserStatus: 1002}
]
var $fakeUserStates = {
	1000: 'pending',
  1001: 'ready',
  1002: 'cancelled',
  1003: 'banned'
};

function MyViewModel() {
	var self = this;
  
  self.userStates = [];
  
  self.loadMapping = function () {
  	return $fakeAsync('api/fakemappingcall', $fakeUserStates).done(function (result) {
    console.log('mapping gathered');
    	self.userStates = result;
    });
  };
  
  self.loadData = function () {
  	return $fakeAsync('api/fakedatacall', $fakeData);
  };
  
  self.method = function () {
  	self.loadData().done(function (result){
      _.each(result, function (r) { _.extend(r, { 'UserStatusText': self.userStates[r['UserStatus']] }) });
      console.log(result);
    });
  };
  
  self.loadMapping().done(function () {
  	self.method();
  });
};

ko.applyBindings(new MyViewModel());

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>