Angular 2 FormBuilder 类型

Question

学习Angular 2，我第一次看到ngModel，现在看到了FormGroup/FormBuilder，它会更好地制作复杂的表单。但我注意到，使用 FormBuilder，我们失去了 TypeScript 赋予的所有静态类型能力。

所有的 observables 和 main 对象都被输入为 any。有什么办法可以避免这种情况吗？

与此相关，我看到 TypeScript 2.1 具有“映射类型”，在我看来，这对于在 observables 接口中转换标准接口而不丢失属性类型是一件好事，但我看到没有人谈论这个角度。

Answer 1

angular中的形式有两种

1. 模板驱动

和

1. 反应式表单（使用 FormGroup/FormBuilder ）。

在我看来，响应式表单很好，因为可以自定义验证选项，并且可以创建动态表单。这两个特性让响应式表单更加强大。

反应式表单链接Angular2 reactive form confirm equality of values

我认为对于 observables，我们已经使用了类型 Observable <person[]> ;

对于每个对象，我们可以定义其接口并在组件中使用。

但是是的，使用映射类型我们将获得更多选项，例如只读、代理......

nodbody 谈论映射类型是因为它在 TypeScript 2.1 中，但对于我们的 Angular 应用程序，我们使用 "typescript": "~2.0.10" 来保持我们的应用程序稳定。

映射类型

一个常见的任务是采用现有类型并使其每个属性都完全可选。假设我们有一个`Person：

interface Person {
    name: string;
    age: number;
    location: string;
}

它的部分版本是：

interface PartialPerson {
    name?: string;
    age?: number;
    location?: string;
}

使用映射类型，PartialPerson 可以写为 Person 类型的广义转换：

type Partial<T> = {
    [P in keyof T]?: T[P];
};

type PartialPerson = Partial<Person>;

映射类型是通过结合文字类型和计算新对象类型的一组属性来生成的。它们类似于 Python 中的列表推导式，但不是在列表中生成新元素，而是在类型中生成新属性。

除了 Partial 之外，映射类型还可以表达许多有用的类型转换：

// Keep types the same, but make each property to be read-only.

    type Readonly<T> = {
        readonly [P in keyof T]: T[P];
    };

// Same property names, but make the value a promise instead of a concrete one

    type Deferred<T> = {
        [P in keyof T]: Promise<T[P]>;
    };

// Wrap proxies around properties of T

    type Proxify<T> = {
        [P in keyof T]: { get(): T[P]; set(v: T[P]): void }
    };