Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • 01:12
    pullapprove[bot] review_requested #44347
  • 01:12
    Highbury14 ready_for_review #44347
  • 01:12
    Highbury14 edited #44347
  • 01:09
    google-cla[bot] labeled #44347
  • 01:09
    Highbury14 opened #44347
  • 00:11
    dario-piotrowicz commented #41483
  • 00:10
    dario-piotrowicz commented #41483
  • 00:07
    ngbot[bot] milestoned #44346
  • 00:07
    ngbot[bot] milestoned #44346
  • 00:07
    ngbot[bot] milestoned #44346
  • 00:07
    zarend labeled #44346
  • 00:07
    zarend opened #44346
  • 00:07
    zarend labeled #44346
  • 00:06
    twerske edited #44337
  • 00:05
    twerske edited #44337
  • 00:04
    renovate[bot] synchronize #44273
  • 00:04

    renovate[bot] on angular

    build: update angular (compare)

  • 00:04
    renovate[bot] edited #44273
  • 00:03
    renovate[bot] synchronize #44152
freshdev1
@freshdev1
Works now. I was using formArray.clear() to clear out old objects. which was causing some issue, I don't know.
Was also using it with removeAt
Final working code:
onDocumentUpdate(documentsArray: DocumentModel[]): void{
    if(documentsArray == undefined)
    {
      return; 
    }

    var docsControls = this.contractForm.controls["TenantContractDocuments"] as FormArray;

    while(docsControls.length !== 0)
    {
      docsControls.removeAt(0);
    }

    documentsArray.forEach((element: DocumentModel) => {
      let docGroup = this.formBuilder.formGroup(DocumentSubmission);
      let document = element as DocumentSubmission;

      docGroup.patchValue(document);
      docsControls.push(docGroup);
    });
  }
Daniel Willis
@danww
I don't think formArray.clear() is a thing, unless it's in the RxWeb library?
freshdev1
@freshdev1
What was not working:
onDocumentUpdate(documentsArray: DocumentModel[]): void{
    if(documentsArray == undefined)
    {
      return; 
    }

    var docsControls = this.contractForm.controls["TenantContractDocuments"] as FormArray;

    docsControls.clear();
   docsControls = new FormArray([]);

    while(docsControls.length !== 0)
    {
      docsControls.removeAt(0);
    }

    documentsArray.forEach((element: DocumentModel) => {
      let docGroup = this.formBuilder.formGroup(DocumentSubmission);
      let document = element as DocumentSubmission;

      docGroup.patchValue(document);
      docsControls.push(docGroup);
    });
  }
I read it on some of the answers and tried.
Its from the angular itself
Daniel Willis
@danww
Yeah, docsControl needs to remain a reference to the existing formArray
hmmm makes sense, I was reassigning it to the parent form even after initializing a new one. But that too was not working.
thanks for the help! :smile:
Daniel Willis
@danww
No worries.
Weird, .clear() is in the docs: https://angular.io/api/forms/FormArray#clear
But doesn't seem to exist. IDE/Stackblitz throws error.
freshdev1
@freshdev1
yeah. there is definitely some issues with it. on my local it exists and works, but when I use it it won't update the actual main FORMGROUP.
that was where I was having hard time
freshdev1
@freshdev1
this was how I was doing at another place:
    var contractedBeds = this.contractedBedsFormGroup.controls['AddContractedBeds'] as FormArray;
    contractedBeds.clear();

    //remove all the objects from form array:
    while (contractedBeds.length !== 0) {
      contractedBeds.removeAt(0)
    }

    $event.forEach(element => {
      contractedBeds = this.formBuilder.array([this.formBuilder.formGroup(TenantContractContractedBed)]);

      let contractedBedsGroup = this.formBuilder.formGroup(TenantContractContractedBed);
      contractedBedsGroup.patchValue(element);
      contractedBeds.push(contractedBedsGroup);  
    });

    this.contractedBedsFormGroup.controls["AddContractedBeds"] = contractedBeds; //I was doing this also with an understanding may be it is loosing the reference
Daniel Willis
@danww
I think it's best to stick with referencing the original formArray and modifying it, rather than replacing it. Especially if you have any exisiting subscriptions elsewhere that might be listening to it.
freshdev1
@freshdev1
Agree. I didn't do it in the start, but rather when clear and removeAt was not working, I added it. But now I have removed this line.
Daniel Willis
@danww
Cool cool.
Aishasadat123
@Aishasadat123
what is wrong i this swich case ?
<input type="number" class="form-control" formControlName="{{ child.formControlName }}" />
          <div [ngSwitch]="type">
            <input
              *ngSwitchCase="number"
              class="form-control"
              formControlName="{{ child.type.formControlName }}"
            />
            <ng-select
              *ngSwitchCase="select"
              [items]=""
              class="text-capitalize"
              [searchable]="true"
              formControlName="{{ child.type.formControlName }}"
            >
            </ng-select>
          </div>
Tiantang Sun
@stt106
should I create a component for each CRUD operation or use a single component for all?
DrewMoody
@DrewMoody

I haven't looked into this yet, but does anyone know if you can access context of an element through ViewChildren? Specifically trying to grab context for a mat-row in a mat-table

<tr mat-row *matRowDef="let row; columns: columns"></tr>

I am hoping for access to that row context

Dominic Watson
@intellix
I'm trying to debug performance issues by using Chrome Developer Tools performance recording and analysing the output.... but it's just polluted by Zone. The whole thing is basically: 100% used inside Zone. How am I meant to address performance issues if zone just wraps everything and consumes all knowledge about what's happening?
it makes everything unreadable and unusable I just can't read the output
SAGO
@SAGOlab
Hi there, someone have some news about csp (content security policy)? I need to pass a dynamic nonce to inline style and script, and I cannot use unsafe inline because of internal policy, there is a way to achieve this? Extending webpack or in another way? Thanks
Urban
@UrKr
Wish you could use rxjs operators on component inputs
Amin Bashanfar
@Amin-bash
Hello guys, I have an input that has a card number and I want to put space between every 4 numbers how can I do that
Urban
@UrKr
@mlc-mlapis Interesting, thanks for the links
Pankaj Sharma
@iimphoenix310_twitter
Hi im new to Angular development. Im from India. Can anyone please suggest a better way to use AMP with Angular?
mridul-netizen
@mridul-netizen
Can we use angular universal for SSR purposes if the backend is in Flask?
Also are there some advantages of using EventEmitters over Subject for cross component communication?
RonnBlack
@RonnBlack
I have built some components in angular9 that use the arrow keys to toggle dropdowns and select options. When I have NVDA (ADA Screen Reader) running my components do not receive keydown and keypress events for the arrow keys. Has anyone experienced this and can you tell me how to make this work with NVDA?
Alessandro Tagliapietra
@alex88
HI everyone, is there a way to have sequential async guards? Right know when I have multiple guards returning an Observable<UrlTree> not the first guard that fails decides the redirect
Alessandro Tagliapietra
@alex88
oh nice didn't find that! Thanks @mlc-mlapis
Miloš Lapiš
@mlc-mlapis
@alex88 :thumbsup:
Daniel Willis
@danww
@UrKr @mlc-mlapis I'm not sure I understand the use case here; you can already pass an Observable as an @Input() to a Component. What do these decorators add?
Tiantang Sun
@stt106
I have a pair of input fields which stores a name and a number separately. The problem is I don't know how many pairs are needed; and the number of such pairs needed depends on a user input, e.g. if user enters 7, then I will need to dynamically generate 7 such pairs. Can someone please point how to handle this for a beginner like me? Any reference I can read?
aidosmen
@aidosmen
Hi guys , how do you make Telegram authorization in angular app ? I have found one solution https://stackoverflow.com/questions/56407518/how-can-i-include-the-telegram-login-widget-in-an-angular-app . But the second asnwer code gives me Refused to frame. When I open the same iframe in browser , in browser it works
Miloš Lapiš
@mlc-mlapis
@danww You can do many things, including passing an observable with your logic and behavior, but @ObservableInput() concentrates on transforming a standard input into an observable input, and as a result, simplification and standardization, how and where to detect a change on such input (usually used some code in ngOnChanges or using setters, ...).
Ijee
@Ijee
Hey can anyone tell me what I am doing wrong with my router animation? It probably is something stupid but it does not get removed before the enter transition starts and thus both components are briefly shown (also doesn't seem to use the fade in that codesandbox for some reason although it does in my actual project).
I made a codesandbox with the problem to see here https://codesandbox.io/s/nifty-river-st8wl?file=/src/app/fadeAnimation.ts
Tiantang Sun
@stt106
I have a dropdown which will be used in many other templates so I put this dropdown into a single component; how do other components reference the selected value from this common component?
Miloš Lapiš
@mlc-mlapis
@stt106 A component has inputs and outputs usually.
Tiantang Sun
@stt106
ok so I can pass the common component into other components that reference it?
Acoder-Ana
@Acoder-Ana
Hello. I have webiste project built with angular as frontend and C# asp.net 3.x as backend.
How I setup on my local IIS?
Miloš Lapiš
@mlc-mlapis
@stt106 You should probably start with official docs on https://angular.io/guide/inputs-outputs.