Angular: No provider found for dynamic Component -> dynamic (Location inject)

[insinfo]

I updated my angularDart project to dart 2.4.0 and now I can no longer inject Location into the Component Constructor.
I just remove the location of the constructor that stops giving the exception

• [ ] Dart SDK Version 2.4.0
• [ ] AngularDart Version 5
• [ ] Whether you are using Windows
• [ ] Whether you are using Chrome

@Component(
  selector: 'orcamento_form',
  styles: [],
  templateUrl: 'orcamento_form_component.html',
  directives: [    
    coreDirectives,
    formDirectives,
    MdToast,
    routerDirectives,
    MaterialButtonComponent,
    MaterialSelectComponent,
    MaterialSelectItemComponent,
    MaterialCheckboxComponent,
    AutoDismissDirective,
    AutoFocusDirective,
    MaterialIconComponent,
    MaterialButtonComponent,
    MaterialTooltipDirective,
    MaterialDialogComponent,
    ModalComponent,
    DataTableComponent,
    displayNameRendererDirective,
    EmpresaListComponent,
    TextMaskDirective,
    AnoValidator,
    DateTimeValueAccessor,
    MoneyMaskDirective
  ],
  exports: [RoutePaths, Routes],    
)
class OrcamentoFormComponent   {

  final Location _location ;

  OrcamentoFormComponent( this._location);


}

```yaml
name: siscec2browser
description: A web app that uses AngularDart Components
version: 0.0.1

environment:
sdk: '>=2.4.0 <3.0.0'

dependencies:
angular: ^5.3.0
angular_components: ^0.13.0
angular_forms: ^2.0.3
angular_router: ^2.0.0-alpha
http: ^0.12.0
stream_transform: ^0.0.19
sass_builder: ^2.1.3
firebase: ^5.0.4
firebase_dart_ui: ^0.1.1
js: ^0.6.1+1
money: ^0.2.1
decimal: ^0.3.4

dev_dependencies:
angular_test: ^2.3.0
build_runner: ^1.6.2
build_test: ^0.10.3
build_web_compilers: ^2.1.0
pedantic: ^1.7.0
test: ^1.6.0

```

[leonsenft]

@insinfo Are you making any attempt to provide Location before loading this component?

[insinfo]

After breaking my head for two days, I found out what was causing the "No provider found for dynamic 'Component name' -> dynamic" exception.

After many attempts to make my project work correctly with AngularDart 5.3.0 and dart 2.4.0, I find that simply importing the 'dart: html' package to cause the error if I remove the import from the 'dart: html 'the error stops happening

import 'dart:async';
import 'package:angular_router/angular_router.dart';
import 'package:angular/angular.dart';
import 'package:angular_forms/angular_forms.dart';
import 'package:angular_components/angular_components.dart';
//import 'dart:html';

@Component(
  selector: 'recurso-form',
  //styles: [],
  templateUrl: 'fonte_recurso_form_component.html',
  directives: [ 
    coreDirectives,
    formDirectives,
    routerDirectives,
    materialInputDirectives,
    MdToast,    
    MaterialFabComponent,
    MaterialButtonComponent,
    MaterialSelectComponent,
    MaterialSelectItemComponent,
    MaterialCheckboxComponent,  
    MaterialIconComponent,
    MaterialButtonComponent,
    MaterialTooltipDirective,
    MaterialDialogComponent,
    ModalComponent,    
    displayNameRendererDirective,  
    DataTableComponent,
    TextMaskDirective,
    AnoValidator,
    DateTimeValueAccessor,
    MoneyMaskDirective
  ],
  providers: [ClassProvider(FonteRecursoService)],
) 
class FonteRecursoFormComponent implements OnInit, OnActivate {
  @ViewChild('toastElement')
  MdToast toastElement;

  FonteRecurso recurso;
  FonteRecursoService _service = FonteRecursoService();    
  Location _location; 
  int id;
  bool showEmpresasDialog = false;

  FonteRecursoFormComponent(this._service, this._location){
    print(this._location);
  }

  @override
  void ngOnInit() async {

  }
}

[leonsenft]

Ah yes, this is because both dart:html and package:angular_router export symbols named Location. I believe there's an analysis warning for this, are you using an editor with Dart analysis enabled?

You can simply hide the Location from dart:html if you don't need it

import 'dart:html' hide Location;

or import it with a prefix if you do

import 'dart:html' as html;

[insinfo]

@leonsenft I am using visual studio code and it does not display any warning about it. Why in angular 5.2.0 and dart 2.1.0 I didn't have this problem?

[leonsenft]

Oh interesting. I'm not sure why. My guess would be something in the analyzer (package:analyzer) changed and it affected how our compiler handled a symbol collision like this when reading injected types.

[hkirk]

FYI I've seeing the same error, but don't have any Location class. Seems I'm trying to import a service - StudyService in my applicatoin - don't think you found the root cause.
import 'dart:html' as html; Solved my problem. So maybe there are something in dart:html which are the cause.