This repository was archived by the owner on Sep 16, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 232
NgIf initiated by an ComponentFactory thows an error when trying to copy an NgContent #1943
Copy link
Copy link
Open
Description
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 {}
Metadata
Metadata
Assignees
Labels
No labels