Есть ли способ использовать один общий шаблон формы для нескольких угловых форм

Я работаю над проектом angular 2 и имею общий шаблон формы, который я хочу использовать примерно для 5 форм, потому что все они будут использовать один и тот же html. Я решил сделать это таким образом, чтобы предотвратить создание нескольких шаблонов с повторяющейся структурой html.

Поля, включая тип виджета, являются частью моей модели данных, поступающей с сервера. Внутри моего компонента общей формы эти типы виджетов используются для возврата html для виджета. Внутри моего шаблона директива innerHTML берет возвращенный html и отображает его в представлении. Шаблон ничего не знает об элементах управления формы. Он просто принимает данные формы с сервера и отображает результаты. Этот шаблон используется не только для обычных форм, но и для фильтров, потому что фильтры - это просто еще одна форма. Существует также компонент общих фильтров, расширяющий компонент формы.

Поэтому для моих фильтров я хотел бы иметь возможность привязать эти поля к моим данным, чтобы фильтровать список элементов. Проблема в том, что, поскольку html виджета отображается внутри компонента и добавляется в dom с использованием innerHTML в представлении, нет возможности использовать ngModel на входах. Возможно, одним из способов сделать это может быть использование ngSwitch внутри шаблона для рендеринга правильного виджета на основе типа виджета, но я не был точно уверен.


angular angular2-forms angular2-template
person Teeman    schedule 22.09.2017    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вы можете создать для этого общий компонент формы и использовать его по своему усмотрению.

Если вы не можете создать общий компонент, вы также можете использовать тот же шаблон html для любого компонента, который вы создаете. Предположим, у вас есть comp1 и comp2

@Component({
    selector: 'comp1',
    templateUrl: 'MyGenericTemplate.html'
})

@Component({
    selector: 'comp2',
    templateUrl: 'MyGenericTemplate.html'
})
person omeralper    schedule 22.09.2017
comment
Большой! Огромное спасибо! Как в этом случае будет связываться с использованием ngModel? Придется ли мне выполнять привязку к одним и тем же объектам в обеих формах? - person Teeman; 23.09.2017
comment
Допустим, у вас есть переменная с именем var1 в шаблоне, у вас также должна быть эта переменная в компоненте. Фактически компоненты и файлы шаблонов объединяются в один файл во время компиляции. Но я не мог понять, почему у вас просто не может быть один-единственный компонент для всех? Просто сделайте общий компонент. Думаю, не нужно делать один шаблон для нескольких компонентов. Я думаю, ты что-то не так делаешь. - person omeralper; 25.09.2017