Угловой ввод для сложного объекта

Question

У меня есть объект с 3 строковыми членами, и я хочу сделать для него вход многократного использования, потому что он используется много раз во всем приложении, поэтому я пытаюсь создать пользовательский ввод, который содержит все входы трех членов. Но я не нашел пути, потому что другие решения, которые я нашел, не позволяют мне проходить сложный объект (MyObject) через ngModel на мой компонент пользовательского ввода. Чтобы добавить сложности в мой вопрос, мне также нужно проверить мой пользовательский ввод: если мой пользовательский ввод required все 3 подвхода required, если один из вложенных элементов заполнен, остальные 2 required, если один из вспомогательных входов недействителен, мой пользовательский ввод тоже недействителен.

Вот пример того, как я хотел бы, чтобы мой код работал (если возможно)

MyObject.ts

export class MyObject {
    name: string;
    category: string;
    areaName: string;
}

MyFormComponent.ts

@Component({
    selector: 'app-my-form'
    template: `
     <form #myForm="ngForm">
       <my-object-input [(ngModel)]="myObj" ></my-object-input>
     </form>`
})
export class MyFormComponent {
    myObj: MyObject;
}

Спасибо

Answer 1

Я не вижу проблем, чтобы решить вашу задачу, создав пользовательский контроль формы. Следуйте этой хорошо объясненной статье custom-form-controls-in-angular-2. В этой статье вы также можете найти способ добавления пользовательских правил проверки.

Общая идея заключается в реализации ControlValueAccessor интерфейс в вашем пользовательском элементе управления формы и добавить свою логику в пользовательский writeValue(value: any) метод.