3

I am using bootstrap material design for my angular app. Everything works fine except when I change the models associated with inputs (floating label inputs) programmatically after the page has been loaded, the floating labels are not floated.

FLoatinglabel issue

T J
  • 40,740
  • 11
  • 73
  • 131
Anoop Kc
  • 89
  • 1
  • 7

2 Answers2

4

You must fire a change event when you change the value programmatically.

Fez Vrasta
  • 11,462
  • 19
  • 73
  • 135
  • A clean way to do it is changing ng-model directive as proposed in [this comment](https://github.com/FezVrasta/bootstrap-material-design/issues/148#issuecomment-150169488) by [Josephdias92](https://github.com/Josephdias92) at github. – atfornes Aug 31 '16 at 17:14
  • 1
    Yes actually if someone wants to use a framework like Angular, React or so on should avoid to use the built-in JS and write its own components – Fez Vrasta Sep 01 '16 at 11:09
0

If you are using Angular2 then no custom directive is needed. On the label do something like this.

<label [class.active]="name && name.length > 0">Some Label</label>
KevinM
  • 1,771
  • 3
  • 26
  • 55