curt curt - 3 months ago 15
Dart Question

Paper-textarea Is Readonly in AngularDart Component

I got a paper-dialog to work fine with paper-input in an AngualrDart component. When I tried a paper-textarea, it is read only.

Here is a working paper-input and the read-only paper-textarea:

<paper-input #artistInputDeath type="text" ngDefaultControl
[(ngModel)]="death_year" ngControl="artistInputDeath"
label="Death Year" required allowed-pattern="[0-9]" maxlength="4"
(keyup.enter)="onDialogSubmit(true)">
{{ death_year }}
</paper-input>

<paper-textarea #artistInputNotes type="text" ngDefaultControl readonly="false"
[(ngModel)]="notes" ngControl="artistInputNotes"
label="Notes"
(keyup.enter)="onDialogSubmit(true)">
{{ notes }}
</paper-textarea>


If I put notes in value="", nothing appears. I've tried removing various options to no effect. In the Dartium inspector this is what it shows for the field:

<paper-textarea _ngcontent-dye-5="" label="Notes" ngcontrol="artistInputNotes" ngdefaultcontrol="" readonly="false" type="text" class="ng-untouched ng-valid ng-pristine">
Hard bop, soul jazz, grove.
Given name is Julian Adderley
</paper-textarea>


Could it be that paper-textarea doesn't work with angular?

Answer

It kinda helps if you import the right libraries. I assumed the paper-input libraries were sufficient since the documentation for paper-textarea was part of paper-input. I added this to my controller:

import 'package:polymer_elements/paper_textarea.dart';

and this to my index.html:

<link rel="import" href="packages/polymer_elements/paper_textarea.html">
Comments