angular-components

问题 When I create a component using ViewContainerRef and assign instance to a property of parent component, which is responsible for child component creation, do I need to set this property to null after I call ViewContainerRef.clear() if I want memory to be freed? 回答1: No, if you assign parent component property to componentRef angular won't remove component from memory. Angular only destroys component and removes its own references to this component. But reference to componentRef remains to

问题 I am trying to upgrade my AngularJS directive to Angular Component. Here is the code of directive: ng1AppModule.component('ng1Tmp', { bindings: {p: '<'}, require: {ngModel: 'ngModel'} }); And I tried to upgrade it by: @Directive({selector: 'ng1-tmp'}) class Ng1HTmpComponent extends UpgradeComponent{ @Input() p: string; @Input() ngModel: INgModelController; constrcutor(elementRef: ElementRef, injector: Injector) { super('ng1Tmp', elementRef, injector); } } It doesn't work well. It seems not to

问题 I could just do <my-awesome-component *ngIf="ConditionToIncludeComponent"></my-awesome-component> But every document on inserting component in dom dynamically is based on ViewContainerRef. I like what it does. But what makes it so special over *ngif? Just point out pros and cons of both. Please. Thanks! 回答1: TLDR; If you don't know what component will be used in a component template when putting together this template use viewContainerRef . If you do know the component beforehand but it can

问题 So, I was trying to get the solution of this problem. But, somehow I am unable to do so, May be because of the lack of knowledge in angular 5. This is my service: GetCurrentUserData(): Observable<ResponseData> { return this.http.get<ResponseData>(ApplicationURLS.GetCurrentUserInformation) .map(response => { return response; }); //.catch(error => this.handleError(error)); } This is my component: public GetCurrentUserInformation(): any { return this.loginService.GetCurrentUserData().subscribe

问题 Is there a way to get rid of the spec.ts file in Angularjs 2, whenever I create a new component. I know this is for testing purpose but what if I don't need it. May be there is some setting to disable this specific testing file. 回答1: Updated for angular 8 CLI ng generate component --skipTests=true component-name Inside your angular-cli.json set the spec.component parameter to false : { ... "defaults" : { ... "spec": { ... "component": false } } } or use the --spec=false option during creation

问题 I wonder what is the "Angular/Typescript way" to set up default values for optional properties in Angular component? I am having troubles when values passed to optional properties are null or undefined . Currently I am having something like this: export class FooComponent implements OnInit { @Input() foo = 'foo'; @Input() bar = 0; @Input() baz?: string; } If you declare default value, you dont have to specify type since it is type of assigned value and property is optional by default. This is

问题 I am building a component (html, css, spec.ts, ts) in angular in which I always want endDate > startDate. I have followed this link https://material.angular.io/components/datepicker/overview in order make multiple datepickers. Below is my HTML for startDate and endDate : startDate: <div class="start-date" fxFlex="50%" fxFlexOrder="1"> <mat-form-field> <input matInput [matDatepicker]="picker1" placeholder="{{'PORTAL.STARTDATE' | translate}}" type="text" formControlName="startDate" [(ngModel)]=

问题 I am building a component (html, css, spec.ts, ts) in angular in which I always want endDate > startDate. I have followed this link https://material.angular.io/components/datepicker/overview in order make multiple datepickers. Below is my HTML for startDate and endDate : startDate: <div class="start-date" fxFlex="50%" fxFlexOrder="1"> <mat-form-field> <input matInput [matDatepicker]="picker1" placeholder="{{'PORTAL.STARTDATE' | translate}}" type="text" formControlName="startDate" [(ngModel)]=

问题 I am working on solution in which i want to append dynamically created component after clicked row I have table consist rows with action button on click of which i will call angular function and load component after that row. Here is table code <div class="row" *ngFor="let rData of reportData; let i = index;" > <div class="col" > <button class="btn btn-sm" (click)="loadChildComponent()">+</button> </div> <div class="col">Name</div> <div class="col">Description</div> <ng-template #dynamic></ng

问题 I have an Angular 2.4.0 application I'm working on with a form that has some backing Javascript validating/formatting a couple of the fields. When the formatting of the fields completes, the view does not update if the value returned from the formatting matches the original value attached to the model. Is there a way to force the view to update? Since there isn't a model change, forcing a component refresh hasn't had any effect. I'm guessing I'll need to update the view separately with