Использование dojo / text! из класса Typescript

Question

Я видел несколько примеров, которые подразумевают, что это возможно, но я не добился успеха. Я использую Typescript 2.7.2. Наш проект имеет множество расширений dijit._Widget и dijit._TemplatedMixin, написанных на JavaScript. Мы постепенно переходим к Typescript. Я создал интерфейс, который расширяет эти два класса (и другие) конструктором в файле d.ts и расширяет этот интерфейс в классе, написанном на Typescript, используя синтаксис определения класса AMD. Я объявляю расширение этого класса и пытаюсь использовать dojo / text! загрузить HTML-шаблон в расширении. Это form.d.ts:

/// <reference path="../../../../../../../node_modules/dojo-typings/dojo/1.11/dojo.d.ts" />
/// <reference path="../../../../../../../node_modules/dojo- typings/dijit/1.11/dijit.d.ts" />
/// <reference path="../../../../../../../node_modules/@types/dom.generated.d.ts" />

declare namespace com {
  namespace foo {
    namespace bar {
      namespace web {
        namespace components {
          namespace form {
            interface ModelObjectMainFormView extends dijit._Widget, dijit._TemplatedMixin, dijit._WidgetsInTemplateMixin, dojo.Evented {
              on(type: string | dojo.ExtensionEvent, func: dojo.EventListener | Function): dojo.WatchHandle;
              emit(type: string | dojo.ExtensionEvent, ...events: any[]): boolean;
            }

            interface ModelObjectFormViewConstructor {
              new (args: Array<any>);
            }

          }
        }
      }
    }
  }
}

Это modules.d.ts:

/// <reference path="index.d.ts" />

declare module 'com/foo/bar/web/components/form/ModelObjectMainFormView' {
  type ModelObjectMainFormView = com.foo.bar.web.components.form.ModelObjectMainFormView;
  const ModelObjectMainFormView: com.foo.bar.web.components.form.ModelObjectFormViewConstructor;
  export = ModelObjectMainFormView;
}

declare module "dojo/text!*" {
  var _: string;
  export default _;
}

Это декларация AMD о расширении:

import declare = require("dojo/_base/declare");
import ModelObjectMainFormView = require("com/foo/bar/web/components/form/ModelObjectMainFormView");

class TSModelObjectMainFormView {
  inherited: (args: Object) => any;
}

var exp = declare("com.foo.bar.web.components.form.TSModelObjectMainFormView", [ModelObjectMainFormView], new TSModelObjectMainFormView());
export = exp;

Это расширение, которое пытается использовать dojo / text!:

/// <amd-dependency path="dojo/text!com/foo/bar/web/workItems/configuration/forms/templates/ConfigurationWorkItemMainFormView.html" name="template" />
import * as aspect from 'dojo/aspect';
import * as domAttr from 'dojo/dom-attr';
import * as domClass from 'dojo/dom-class';
import * as domConstruct from 'dojo/dom-construct';
import * as lang from 'dojo/_base/lang';
import ModernizationUtil = require('com/foo/bar/rtc/web/util/ModernizationUtil');
import MimeTypes = require('com/foo/bar/web/scm/MimeTypes');
import * as TSModelObjectMainFormView from '../../../components/form/TSModelObjectMainFormView';
// import * as template from "dojo/text!com/foo/bar/web/workItems/configuration/forms/templates/ConfigurationWorkItemMainFormView.html";
let template: string;

export class ConfigurationWorkItemMainFormView extends TSModelObjectMainFormView {
  templateString = template;

  constructor(args?: any) {
    super(args);
  }
}

Я использую ams-зависимость, потому что импорт dojo / text! не удается во время выполнения, когда он пытается получить модуль. Это не может найти это. Код dojo генерирует некоторый уникальный идентификатор на основе URL ресурса с dojo / text! в начале, затем число, затем!, затем остальная часть URL. Он просматривает набор модулей, ожидающих найти его в строке кода, которая выполняет импорт, но это не удается. Модуль отчетов не найден. С помощью ams-зависимости шаблон фактически определяется в источнике как строка и содержит HTML-код, загруженный dojo / text! когда вызывается конструктор класса. Проблема в том, что вызов super () в конструкторе должен быть первой строкой кода, а супер-конструктор зависит от уже установленной templateString. Конечно, переменной экземпляра templateString не присваивается значение шаблона до тех пор, пока не будет возвращен конструктор. Я был бы очень признателен за помощь в этом. Если я могу предоставить больше информации, просто дайте мне знать. Спасибо всем и каждому.

Answer 1

Мне удалось заставить это работать, внеся следующие изменения: К декларации AMD о продлении:

class TSModelObjectMainFormView {
  templateString: string;
  inherited: (args: Object) => any;

  constructor(args?: any) {
    if (args && args.templateString) {
      this.templateString = args.templateString;
      this.inherited(arguments);
    }
  }
}

И до класса Typescript, расширяющего TSModelObjectMainFormView:

constructor(args: any) {
  super(lang.mixin(args, {templateString: template}));
}

Я уверен, что есть лучший способ. Я хотел бы получить совет. Это все еще использует amd-зависимость, которая, насколько я понимаю, устарела.