CODEWITHSUNDEEP
angulardartangular-dartangular2-dart
Blackbam
Blackbam

Reputation: 19376

Angular 2 Dart: How to select and change element in an imported sub-component?

The following angular/ dart library (https://pub.dartlang.org/packages/pikaday_datepicker_angular2) seems not to be written very well as it is not possible to set an external change of the date (there is no setter - I can only set the default day / date in the beginning but not if it changes externallay).

My question is: How can I access the inner of an imported library component in order to change a value or some HTML inside?

my_component.html:

<div>
    <pikaday #pickuptimeselector [day]="selectedDay"(dayChange)="changeDate($event)" format="DD.MM.YYYY"
                       [minDate]="mindate" [maxDate]="maxdate"
                       [(i18n)]="datepickerI18n"
                       firstDay="1">
    </pikaday>
</div>

my_component.dart:

import 'package:pikaday_datepicker_angular2/pikaday_datepicker_angular2.dart';


@Component(
    selector: 'my_component',
    styleUrls: const ['my_component.css'],
    templateUrl: 'my_component.html',
    directives: const [materialDirectives,PikadayComponent],
    providers: const [materialProviders]
)
class MyComponent {

  Map<String,dynamic> datepickerI18n = new Map<String,dynamic>();

  DateTime selectedDay;

  void dayChange() { 
  ...
  }
}

Generated output of the pikaday component from the Chrome console:

<pikaday _ngcontent-oid-5="" firstday="1" format="DD.MM.YYYY"><input type="text" id="pikadayInput1" class="" placeholder="" aria-label="Use the arrow keys to pick a date"></pikaday>

As you can see there is an input inside the component. As Datetime selectedDay changes I want to set a new date value to this input field. How?

Upvotes: 0

Views: 371

Answers (1)

rkj
rkj

Reputation: 9311

This is not possible in any legal way. If your app is using mirrors you could try it, but you should never do it in production application.

Best way is to fix the library and send a pull request.

Upvotes: 1

Related Questions