J F J F - 11 months ago 132
Dart Question

ng-valid and ng-invalid classes in angular dart forms are no more exposed

Dart: 1.24.2;
Angular: 4.0.0;
I created some CSS rules based on

.ng-valid
and
.ng-invalid
classes in angular forms. But, in last releases, it seems that
ng-valid
and
ng-invalid
classes are no more exposed, so my CSS rules are no more working.
Is it correct?
if yes, how can I by-pass this change?

Edit1: Test case
I simply generated a brand new project with angular and angular-material in my IDE (WebStorm). It generates a simple todo application. I took the todo_list_component.html and wrapped the whole content with a
<form>
</form>
tag. In the todo_list_component.dart I have added an import for angular_forms and added formDirectives to the directives list.
Inspecting the form in dartium no
ng-valid
class has been added. The only class added, in my case is:
class="_ngcontent-umj-2"


Edit2: Shortcut
Not very elegant, but working:

<form #form="ngForm" [class.ng-valid]="form.valid" [class.ng-invalid]="!form.valid">

Answer Source

Yes, this behavior changed in a recent release of angular_forms.

Previously, the NgControlStatus directive was included in list of formDirectives. However, this caused every component that used forms to pay the price for these host bindings.

Now, if you want the behavior, you need to include NgControlStatus explicitly in the directives list of the @Component.

https://github.com/dart-lang/angular/blob/master/angular_forms/lib/src/directives/ng_control_status.dart#L15

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download