Type Error with multiple MaterialDropdownSelectComponents on the same view

[grundid]

I'm getting an error like:

EXCEPTION: Type List<Location> should be List<Employee> to implement expected type Iterable<Employee> when selecting from one of the lists. This also happens when one of the dropdown lists is in a sub component on the same view. Using ´directiveTypes´ seams to have no effect here.

Running angular 5.3.0, Angular_components 0.12.0 and Dart VM version: 2.2.1-dev.3.1 (Mon Apr 8 08:57:36 2019 +0200) on "macos_x64"

My code is:

import 'package:angular/angular.dart';
import 'package:angular_components/angular_components.dart';

class Employee implements HasUIDisplayName {
  final String label;
  Employee(this.label);

  @override
  String get uiDisplayName => label;
}

class Location implements HasUIDisplayName {
  String companyLabel;
  Location(this.companyLabel);

  @override
  String get uiDisplayName => companyLabel;
}

@Component(
    selector: 'my-app',
    directives: [MaterialDropdownSelectComponent],
    providers: [materialProviders],
    templateUrl: "app_component.html",
    directiveTypes: [
      Typed<MaterialDropdownSelectComponent<Location>>(on: "locationSelect"),
      Typed<MaterialDropdownSelectComponent<Employee>>(on: "employee"),
    ])
class AppComponent implements OnInit {
  static final List<Employee> knownEmployees = [Employee("E1"), Employee("E2")];
  final SelectionModel<Employee> selectedEmployee = SelectionModel.single();

  SelectionOptions<Employee> possibleEmployees =
      SelectionOptions.fromList(knownEmployees);

  String renderSelectOption(option) => option.uiDisplayName;

  String get selectedLabel => selectedEmployee.selectedValues.length > 0
      ? renderSelectOption(selectedEmployee.selectedValues.first)
      : 'Choose employee';

  static final List<Location> knownLocations = [Location("C1"), Location("C2")];
  final SelectionModel<Location> selectedLocation = SelectionModel.single();
  SelectionOptions<Location> possibleLocations =
      SelectionOptions.fromList(knownLocations);

  String get selectedLocationLabel => selectedLocation.selectedValues.length > 0
      ? renderSelectOption(selectedLocation.selectedValues.first)
      : 'Choose location';

  @override
  void ngOnInit() {
    selectedEmployee.select(knownEmployees[0]);
    selectedLocation.select(knownLocations[0]);
  }
}

The template:

<div>
    <material-dropdown-select #locationSelect [buttonText]="selectedLocationLabel" [selection]="selectedLocation"
        [options]="possibleLocations" [itemRenderer]="renderSelectOption">
    </material-dropdown-select>
</div>

<div>
    <material-dropdown-select #employee [buttonText]="selectedLabel" [selection]="selectedEmployee"
        [options]="possibleEmployees" [itemRenderer]="renderSelectOption">
    </material-dropdown-select>
</div>

[leonsenft]

Thanks for the detailed repro @grundid.

I'm unable to reproduce the exception internally. It's possible there are changes to package:angular_components that haven't been published yet, or an issue in the dev version of the SDK that you're using, as it's slightly ahead of ours.

Could you please provide a stack trace so I can see where the error is originating?

[nshahan]

It's been a little delayed but I am still working on syncing and publishing a version to go along with angular v5.3.0. "Should be" coming soon.

[grundid]

Thank you for looking into it and sorry for missing the stack trace. I reverted my system back to angular 5.2 and dart 2.2.0 where this problem does not occur.

IIRC the exception happened on line 50 of the single_selection_model_impl.dart file. https://github.com/dart-lang/angular_components/blob/master/angular_components/lib/src/model/selection/single_selection_model_impl.dart

I can update my system back to angular 5.3 and send you the full stack trace later

[nshahan]

@grundid I published angular_components v0.13 that supports angular v5.3 and includes are latest changes.