Skip to content
This repository has been archived by the owner on Sep 16, 2022. It is now read-only.

NgIf initiated by an ComponentFactory thows an error when trying to copy an NgContent #1943

Open
4 tasks done
valakis opened this issue Jan 9, 2021 · 0 comments
Open
4 tasks done

Comments

@valakis
Copy link

valakis commented Jan 9, 2021

I have a Component which is used as a “redirection route”. The purpose of the component is to load another component (in this code sample InnerComponent). If loading that component happens via DynamicComponent an error is thrown. If InnerComponent is instantiated from the template of AppCmp with the component’s selector, all is fine.

Note: this issue arises when the component being instantiated uses <ng-content></ng-content>.

html_dart2js.dart:39942 EXCEPTION: RangeError (index): Index out of range: no indices are valid: 0
STACKTRACE:
dart:sdk_internal 12055:21                                                          _get]
main.template.dart 196:59                                                           build
package:angular/src/core/linker/views/embedded_view.dart 80:5                       create
package:angular/src/core/linker/template_ref.dart 34:9                              createEmbeddedView
package:angular/src/core/linker/view_container.dart 112:32                          createEmbeddedView
package:angular/src/common/directives/ng_if.dart 51:22                              set ngIf
main.template.dart 157:23                                                           detectChangesInternal
package:angular/src/core/linker/views/view.dart 110:7                               detectCrash
package:angular/src/core/linker/views/component_view.dart 144:7                     detectChanges
package:angular/src/core/linker/views/host_view.dart 186:19                         detectChangesInternal
package:angular/src/core/linker/views/view.dart 110:7                               detectCrash
package:angular/src/core/linker/views/host_view.dart 148:7                          detectChanges
package:angular/src/core/linker/view_container.dart 80:15                           detectChangesInNestedViews
package:angular_components/dynamic_component/dynamic_component.template.dart 59:19  detectChangesInternal

My workaround was to wrap the InnerComponent with another one , then it works properly.

  • Dart SDK version: 2.10.4 (stable) (Unknown timestamp) on "linux_x64"
  • AngularDart Version 6.0.1
  • Tried on Linux and on Windows too
  • Tested on Chrome and on Firefox
import 'package:angular/angular.dart';
import 'package:angular_components/dynamic_component/dynamic_component.dart';
import 'main.template.dart' as ng;
void main() {
  runApp(ng.AppCmpNgFactory);
}
@Component(selector: 'app', template: '''
       <dynamic-component [componentFactory]="renderer"></dynamic-component>
    ''', directives: [DynamicComponent])
class AppCmp {
  static final ComponentFactory renderer = ng.InnerComponentNgFactory;
}
@Component(
    selector: 'inner',
    template: '<template [ngIf]="true"><ng-content></ng-content></template>',
    directives: [NgIf])
class InnerComponent {}
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant