Несколько дженериков в одном интерфейсе

Если вы хотите ограничить типы, используйте Тип Союза:

type formType = string | number | boolean | date;
export interface IForm {
  name: string;
  url: string;
  fields: IField<formType>[] // <-- What is the proper type of this?
}



let form.default = "adsf";     //valid
let form.default = 1;          //valid
let form.default = true;       //valid
let form.default = new date(); //valid
let form.default = null;       //in-valid
let form.default = undefined;  //in-valid
let form.default = never;      //in-valid

Я бы посоветовал, по крайней мере, с учетом приведенной выше информации, сделать что-то вроде этого:

type PossibleDataTypes = string | number | boolean; // or whatever you want

type PossibleFields =
  | IInput<PossibleDataTypes>
  | IOptions<PossibleDataTypes>
  | ICheckbox;

export interface IForm {
  name: string;
  url: string;
  fields: Array<PossibleFields>;
}

Здесь мы сужаем field до массива только тех типов полей, которые вы ожидаете. Вы можете дополнить этот список, если хотите.

Кстати, я сделал еще одно изменение:

// changed this from IField<IOptionsList<T>> to just IOptionsList<T>
export interface IOptions<T> extends IField<T> {
  type: "options";
  options?:
    | IOptionsUrl
    | ReadonlyArray<IOptionsList<T>>
    | ReadonlyArray<string>;
  multiple?: boolean;
}

потому что ваша переменная meta не соответствует без нее. Также я думаю, что в meta была опечатка, где использовалось data вместо url. В любом случае вы можете определить meta как IForm, как вы это сделали, но расширение переменной до IForm заставит забыть о деталях (например, какие конкретные типы полей вы используете). Если вы просто хотите проверять, который meta соответствует IForm, не расширяя его до IForm, вы можете использовать такую ​​вспомогательную функцию:

const asIForm = <F extends IForm>(f: F) => f;

А затем используйте его как

const meta = asIForm({
  name: "employee",
  url: "/api/employee",
  fields: [
    {
      type: "input",
      name: "id",
      label: "Employee ID",
      default: 0,
      mandatory: true
    },
    {
      type: "options",
      name: "gender",
      label: "Male/Female",
      default: "male",
      options: ["Male", "Female"]
    },
    {
      type: "checkbox",
      name: "active",
      label: "Active",
      default: true
    },
    {
      type: "options",
      name: "department",
      label: "Department",
      default: 0,
      options: {
        url: "/api/departments",
        idField: "id",
        labelField: "name"
      }
    }
  ]
});

Теперь, учитывая тот факт, что PossibleFields является конкретным дискриминированный союз, вы можете заставить компилятор сузить каждую запись field с помощью защиты типа, например:

function processForm(form: IForm) {
  for (let field of form.fields) {
    switch (field.type) {
      case "input": {
        // do something for input
        break;
      }
      case "checkbox": {
        // do something for checkbox
        break;
      }
      case "options": {
        // do something for options
        field.options // <-- no error, known to exist
        break;
      }
      default:
        ((x: never) => console.info("WHAT IS" + x))(field); // guarantee exhaustive
        // If an error appears here -------------> ~~~~~
        // then you missed a case in the switch statement
    }
  }
}

Хорошо, надеюсь, это поможет вам. Удачи!

Ссылка на код