@angular2Эта группа больше не существует

Страница 6 из 179
Alexey
02.08.2016
17:36:03
В Go например такие кейсы решаются кодогенерацией

Ҫѐҏӗѫӑ
02.08.2016
17:36:04
типизированные темплейты нужны

Алексей
02.08.2016
17:36:12
А у них уже шаблоны компилируються в TypeScript - так что они типизированные :)

Google
Alexey
02.08.2016
17:37:00
Т.е если не хочешь много if писать то генерируй код при/ перед компиляцией для рантайма

Ҫѐҏӗѫӑ
02.08.2016
17:37:07
и как там указать типы?

Alexey
02.08.2016
17:38:16
В шаблонах никак, я про метапрограммирование и дженерик код. Тут изначально про динамическое создание компонента спрашивали

Ҫѐҏӗѫӑ
02.08.2016
17:38:24
чото было про tsx у них в репке, но там написали что такого не будет

то вопрос другому Алексею был :)

Sergey
02.08.2016
17:39:22
Да, это печаль

И на хаки с $compile тоже положили - типа медленно, некотролируемо и прочее

Ҫѐҏӗѫӑ
02.08.2016
17:40:42
чот не выходит что ангуляр в 2 или 4 раза круче реакта

кажется он в 2 или 4 раза круче чем ничего

(нарываюсь на бан)

Алексей
02.08.2016
17:41:24
@chicoxyzy Сейчас поддержка TS не очень большая - но они на ng-conf показывали демку и обьясняли что у них будет типизация параметров компонетов с помощью TS ( сейчас помоему уже это есть - нужно проверить ) а типы можно брать из свойств почеченных @Input @Output // directive Dropdown @Directive({ selector: '[dropdown]' }) export class Dropdown implements OnInit, OnDestroy { @HostBinding('class.open') @Input() public get isOpen():boolean {} @Input() public autoClose:string; @Input() public keyboardNav:boolean; // enum string: ['nonInput', always', 'outsideClick', 'disabled'] @Input() public appendToBody:boolean; @Output() public onToggle:EventEmitter<boolean>; }

Alexey
02.08.2016
17:44:50
кажется он в 2 или 4 раза круче чем ничего
Это первое впечатление, за TS и template driven forms с 2 way binding ему можно все простить

В создании сложных форм вряд ли кто то сравнится с ng

Google
Alexey
02.08.2016
17:45:42
Что 1 что 2

Ҫѐҏӗѫӑ
02.08.2016
17:45:42
это так

Алексей
02.08.2016
17:48:44
@bro_science template driven forms - да ну - model driven forms - вот где самый хардкор там вот такое можно делать   this.form.valueChanges .map((value) => { value.firstName = value.firstName.toUpperCase(); return value; }) .filter((value) => this.form.valid) .subscribe((value) => { console.log("valid value: vm = ",JSON.stringify(value)); });

Алексей
02.08.2016
17:49:28
http://blog.angular-university.io/introduction-to-angular-2-forms-template-driven-vs-model-driven/

Sergey
02.08.2016
17:50:03
FormGroup )

Пока нет, там нет updateValue

Алексей
02.08.2016
17:50:26
import { FormGroup, FormControl, Validators, FormBuilder, REACTIVE_FORM_DIRECTIVES } from '@angular/forms'; @Component({ selector: "model-driven-form", directives: [REACTIVE_FORM_DIRECTIVES], templateUrl: 'model-driven-form.html' }) export class ModelDrivenForm { form: FormGroup; firstName = new FormControl("", Validators.required); constructor(fb: FormBuilder) { this.form = fb.group({ "firstName": this.firstName, "password":[" INITIAL VALUE HERE!!! ”, Validators.required] }); } onSubmitModelBased() { console.log("model-based form submitted"); console.log(this.form); } }

https://angular.io/docs/ts/latest/api/common/index/Control-class.html

Alexey
02.08.2016
17:52:18
Пока нет, там нет updateValue
Ты про кастомную реализацию ngModel для своих компонентов?

Там вроде несложно все

Алексей
02.08.2016
17:53:03
и для FormControl - updateValue есть

Sergey
02.08.2016
17:53:42
https://angular.io/docs/ts/latest/api/common/index/Control-class.html
Они допилят, из FormGroup можно только AbstractControl получить

Алексей
02.08.2016
17:54:08
так приведи его тип к Control…

Sergey
02.08.2016
17:54:11
Только сегодня пробовал

Короче, можно, но все в процессе

Maksim
02.08.2016
17:55:49
Да, приводишь и без проблем. Два дня назад делал

Так

Google
Ҫѐҏӗѫӑ
02.08.2016
17:58:47
что такое updatedValue?

Sergey
02.08.2016
17:58:59
Скажем так, можно и у AbstractControl вызвать updateValue, хоть и в d.ts нет метода )

что такое updatedValue?
Значение конторлу изменить из контроллера

Maksim
02.08.2016
18:00:54
Ну там и еще плюшки

Можно это значение скрыто изменить, без вызова событий

И еще что-то, не помню третий аргумент %)

Alexey
02.08.2016
18:51:00
я не очень понимаю зачем в новом @angular/forms использовать model-driven формы

все что мне надо, а делал я уже довольно сложные формы со своими кастомными select/multiselect (с ngModel) и кастомный дженерик компонент form-field который из json schema рендерит любую форму, все это получилось покрыть template driven формами

без создания ControlGroup

в одном только месте с валидацией был затык и пришлось пробрасывать объект формы NgForm внутрь своего form-field чтобы добавить туда FormControl с валидаторами, но сам проброс тоже template driven <form #tagForm="ngForm"> ... <form-field class="gray font-size-12" [name]="key" [schema]="tagType.schema.properties[key]" [form]="tagForm" >

какой кейс вас заставляет использовать model driven формы?

Алексей
02.08.2016
19:00:02
какой кейс вас заставляет использовать model driven формы?
FRP для форм - к примеру debounce на все компоненты - 1 строчкой кода this.form.valueChanges .debounce(500) .map((value) => { value.firstName = value.firstName.toUpperCase(); return value; }) .filter((value) => this.form.valid) .subscribe((value) => { console.log("valid value: vm = ", JSON.stringify(value)); });

Alexey
02.08.2016
19:07:24
this.form это FormGroup ?

Алексей
02.08.2016
19:07:29
да

Alexey
02.08.2016
19:08:12
<form #myForm="ngForm"> - в этом варианте в myForm лежит NgForm

myForm.form - это ваш FormGroup

делайте с ним что хотите

Ҫѐҏӗѫӑ
02.08.2016
19:09:38
<form #myForm="ngForm"> - в этом варианте в myForm лежит NgForm
что-то слишком мало слов form для одной строчки

Алексей
02.08.2016
19:10:01
делайте с ним что хотите
зачем мне ngForm? мне намного больше нравиться FormGroup и FormBuilder - намного проще делать кроссвалидацию и FRP

Google
Alexey
02.08.2016
19:10:58
Так у вас все тоже самое будет, только вместо FormBuilder будут директивы в шаблоне

они соберут вам FormGroup

потом с ним играйтесь так же как и раньше

Алексей
02.08.2016
19:11:57
Ок, а как кроссвалидацию делать?

Alexey
02.08.2016
19:12:21
по конкретней сформулируйте

кейс какой?

Алексей
02.08.2016
19:12:52
ну два поля зависят друг от друга - дата начала и дата конца ( дата начала не может быть позже даты конца )

Alexey
02.08.2016
19:14:03
ну вроде не проблема свои кастомные валидаторы написать которые директивами биндятся к ngModel контролам

тут то же самое, вместо FormBuilder в котором вы руками валидаторы добавляете за вас это сделают директивы

Алексей
02.08.2016
19:14:45
да это изврощение - вот как в формах от модели это элегантно решаеться this.form = fb.group({ name: ['', Validators.required], email: ['', Validators.required] matchingPassword: fb.group({ password: ['', Validators.required], confirmPassword: ['', Validators.required] }, {validator: this.areEqual}) <-------- });

Alexey
02.08.2016
19:15:56
в чем тут элегантность? в том что метод areEqual будет жить в компоненте формы? и не будет переиспользоваться в других местах?

Alexey
02.08.2016
19:17:21
да, и для этого в ng2 действительно есть отдельные классы

почему их не использовать?

Алексей
02.08.2016
19:17:31
this.form = fb.group({ name: ['', Validators.required], email: ['', Validators.required] matchingPassword: fb.group({ password: ['', Validators.required], confirmPassword: ['', Validators.required] }, {validator: MYCustomValidators.areEqual }) <-------- });

Alexey
02.08.2016
19:18:24
хотя дело вкуса конечно, я не настаиваю разумеется на том что надо делать только так

Алексей
02.08.2016
19:18:29
Еще раз как в формах от шаблона присобачить кастомный валидатор для 2х полей сразу? Я пока не видел ни 1 простого решения. Увижу соглашусь :)

Alexey
02.08.2016
19:18:43
просто я думал вы приведете пример где без model forms никак не реализовать

Алексей
02.08.2016
19:19:07
Alexey
02.08.2016
19:25:06
import {Directive, forwardRef} from '@angular/core' import {NG_VALIDATORS, FormControl} from '@angular/forms' function validateDomainFactory() { return (c: FormControl) => { let VALIDATION_REGEXP = /^([a-zA-Z0-9][a-zA-Z0-9-]+\.)?[a-zA-Z0-9][a-zA-Z0-9-]{0,61}[a-zA-Z0-9]\.[a-zA-Z]{2,}$/i return VALIDATION_REGEXP.test(c.value) ? null : { validateDomain: { valid: false } } } } @Directive({ selector: '[validateDomain][ngModel],[validateDomain][formControl]', providers: [ { provide: NG_VALIDATORS, useExisting: forwardRef(() => DomainNameValidator), multi: true } ] }) export class DomainNameValidator { @Input() secondFiled: FormControl // <<<<--- сюда передаем второй контол от которого зависим validator: Function constructor(/*Dependency Injection here*/) { this.validator = validateDomainFactory() } validate(c: FormControl) { return this.validator(c) } }

Google
Alexey
02.08.2016
19:25:17
валидаторы это просто директивы

в них можно передать другой компонент от которого зависит текущий

и реализовать логику

Sergey
02.08.2016
19:26:19
Мне просто удобнее держать всю логику в контроллерах, а не в темплейтах

Алексей
02.08.2016
19:26:47
Блин у валидатора появляеться прямая ссылка на класс компонента - как-то не архитектурненько. Больше на костыль похоже

Alexey
02.08.2016
19:26:57
логика не в темплейте, логика в отдельном файле валидатора, в темплейте мы только декларативно биндим эту логику туда где надо

в ng1 по-моему так и писались валидаторы кастомные

всякие confirm-password валидаторы и т.д

что-то никто не жаловался

Алексей
02.08.2016
19:27:56
Ну а в Ng2 можно не писать директиву чтобы применить валидатор :)

если писать формы от модели

Alexey
02.08.2016
19:28:30
ну да, т.е к чему и пришли можно так а можно этак , кому как нравится

у меня просто взгляд на формы под другим углом видимо

Ҫѐҏӗѫӑ
02.08.2016
19:29:00
чот читаю вас и понимаю что в ангуляре проблема с тем, что можно сделать одно и то же кучей способов

Алексей
02.08.2016
19:29:05
ну да, т.е к чему и пришли можно так а можно этак , кому как нравится
Тут соглашусь. Можно и так и так. Нету и там и там ничего невозможного.

Ҫѐҏӗѫӑ
02.08.2016
19:29:16
он же фреймворк, не должно такого быть

должен быть один способ

Алексей
02.08.2016
19:29:27
чот читаю вас и понимаю что в ангуляре проблема с тем, что можно сделать одно и то же кучей способов
Сказал приверженец React у которого каждый день выходит новый фреймворк :)

Ҫѐҏӗѫӑ
02.08.2016
19:29:39
у реакта ничего не выходит

Alexey
02.08.2016
19:29:40
не, не надо накидывать не React)

Страница 6 из 179

Эта группа больше не существует Эта группа больше не существует