Nico Rodsevich Nico Rodsevich - 1 year ago 73
Dart Question

Angular-dart: Automatic conversion of Component's @input fields from attributes

suppose

<component list-attribute="a b c" bool-attribute></component>


Whats is the best way of having the component state like this:

@Component(...
class Component{
List<String> listAttribute; // Should automatically contain [a,b,c]
bool boolAttribute; // Should automatically contain true

Answer Source

There is nothing un Angular to automatically transform values.

This kind of binding

 list-attribute="a b c" 

will always pass a string.

Possible solutions

At first the property needs an annotation

@Input()List<String> listAttribute;

Passing a list explicitely

 [list-attribute]="['a', 'b', 'c']" 

Make a setter that does the conversion

List<String> _listAttribute
@Input() set listAttribute(String value) {
  _listAttribute = value?.split(' ');
}

with

list-attribute="a b c" 

or

[list-attribute]="'a b c'"

or a custom pipe to do the splitting like

[list-attribute]="a b c | split" 
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download