Отображение динамической валюты: функция шаблона кендо: AngularJS 1.6 (Javascript, а не TS) - PullRequest
Новая
       28

Отображение динамической валюты: функция шаблона кендо: AngularJS 1.6 (Javascript, а не TS)

0 голосов
/ 11 декабря 2018

Я пытаюсь изменить формат валюты в соответствии с предпочтениями пользователя и получаю значение из localStorage.Согласно этой ссылке https://docs.telerik.com/kendo-ui/knowledge-base/show-different-currencies-in-the-grid, я ввел одну функцию в шаблон столбца кендо, которая объявлена ​​вне функции столбца кендо (функция getDefaultColumns).

Моя проблема: шаблон, написанный в field: 'INVOICE_AMOUNT_ORIGINAL',, имеет функцию, вызывающую customCurrencyFormat, но функция не получает вызов, потому что в коде Visual Studio я вижу предупреждение " функция объявлена, но не используется ».Что еще может сделать эту функцию доступной к шаблону в столбце или что я делаю неправильно.

Что я пытаюсь сделать: я получаю случайный формат валюты из локального хранилища в соответствии с предпочтениями пользователя, и яхотите изменить столбец сетки в соответствии с этим.(все валютные форматы: евро, фунты стерлингов, доллары США ...) Также приветствуется любой другой подход

Вот файл 

    // eslint-disable-next-line
import kendo from 'kendo';
import { GetLocalColumns } from './invoiceLocalColumns';

/**
 * @typedef {{instant: (v: string) => string}} Translate
 * @typedef {{isUsUser: () => boolean}} Authentication
 * @typedef {{field_label?: string; field?: string; hidden: boolean; width: number}} Column
 *
 * The field is used to find column details for kendo
 * The column order is specified as an array of fields
 */

/**
 * @param {Translate} $translate
 * @returns {Column[]}
 */
function getDefaultColumns($translate, dateUserPreference) {
  return [
    {
      field: 'CURRENCY_CODE',
      title: $translate.instant('currencyCode'),
      headerTemplate: '{{ \'currencyCode\' | translate }}',
      width: 150
    },
    {
      field: 'INVOICE_AMOUNT_ORIGINAL',
      title: $translate.instant('invoiceAmount'),
      template: '#= customCurrencyFormat(dataItem.INVOICE_AMOUNT_ORIGINAL)#',
      headerTemplate: '{{ \'invAmount\' | translate }}',
      attributes: {
        style: 'text-align: right;'
      },
      width: 115
    },
  ];
}

    function customCurrencyFormat(currencyValue) {
  // eslint-disable-next-line prefer-template
  const curr = "'" + this.localStorage.countryWithCurrency.countrySymbol + "###.##'";
  return kendo.toString(currencyValue, curr);
}
class ColumnCustomizer {
  constructor($translate, $localStorage) {
    const culture = kendo.culture();
    console.log(culture.name);
    this.localStorage = $localStorage;
    this.defaultColumns = getDefaultColumns(
      $translate,
      $localStorage.dateFormat,
      $localStorage.countryWithCurrency.countrySymbol);
  }

  /**
   * @param {string} locale
   * @param {'collection' | 'forecast'} type the view type
   * @returns {Column[]}
   */
  GetColumns(locale, type) {
    const columnNameList = GetLocalColumns(locale, type);
    const columnMap = this.defaultColumns.reduce((res, col) => {
      if (col) {
        const label = col.field_label || col.field;
        if (res[label]) {
          throw Error(`column ${label} declared twice`);
        }
        res[label] = col;
      }
      return res;
    }, {});
    // now the column configuration in the specified order
    const res = columnNameList.map((field) => {
      const col = columnMap[field];
      if (!col) {
        throw Error(`missing configuration for column ${field}`);
      }
      return col;
    });
    return res;
  }
}

module.exports = {
  ColumnCustomizer,
};
...