Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • 19:37
    petebacondarwin closed #24929
  • 19:37
    petebacondarwin commented #24929
  • 19:34
    petebacondarwin closed #24917
  • 19:34
    petebacondarwin commented #24917
  • 19:33
    petebacondarwin closed #23607
  • 19:33
    petebacondarwin commented #23607
  • 19:30
    petebacondarwin commented #23355
  • 19:30
    petebacondarwin closed #23355
  • 19:28
    jessicajaniuk closed #42648
  • 19:28

    jessicajaniuk on master

    build(docs-infra): disambiguate… (compare)

  • 19:28

    jessicajaniuk on 12.0.x

    build(docs-infra): disambiguate… (compare)

  • 19:28
    AndrewKushnir commented #42643
  • 19:27

    jessicajaniuk on 12.0.x

    docs: Fix reference to SwUpdate… (compare)

  • 19:27
    jessicajaniuk closed #42634
  • 19:27

    jessicajaniuk on master

    docs: Fix reference to SwUpdate… (compare)

  • 19:27
    jessicajaniuk closed #42631
  • 19:27

    jessicajaniuk on master

    ci: exclude `service-worker/` s… (compare)

  • 19:27

    jessicajaniuk on 12.0.x

    ci: exclude `service-worker/` s… (compare)

  • 19:27
    bcaua321 starred angular/angular
  • 19:26
    petebacondarwin closed #23317
Miloš Lapiš
@mlc-mlapis
Otherwise, use pure JS to do that.
yash2701
@yash2701

Hi Team,
I am getting unit test error
does anyone have idea what the solution of this one.
I already make package json, which compataible with other packages.

Error during loading: Uncaught Error: A platform with a different configuration has been created. Please destroy it first

Navdeep
@Nav2510
Hi, It is a good practice to add private/public prefix for angular lifecycle hooks also?
moustacheman1
@moustacheman1
In angular, how do I access data in a component from a service?
3 replies
Miloš Lapiš
@mlc-mlapis
@moustacheman1 Probably a wrong question. But generally, you need to get somehow a component reference. Or reverse the mental model and emitting the data to that service.
Ahsanbaloch
@Ahsanbaloch

Hi!
How to update just City value in Cascade dropdown list. As only CityId is stored in Backend and not Country

HTML code

<mat-form-field appearance="outline">
                <mat-label>Select Country</mat-label>
                <mat-select  (selectionChange)="onInputChange($event)"  required>
                <mat-option *ngFor="let Country of CountryList; let j=index" [value]="Country">
                {{j + 1}} {{Country}}
                </mat-option>
                </mat-select>
                </mat-form-field>

                <mat-form-field appearance="outline">
                  <mat-label>Select City</mat-label>
                  <mat-select formControlName="CityId" required>
                  <mat-option *ngFor="let i of CityList; let j=index" [value]="i.CityId">
                  {{j + 1}} {{i.City}}
                  </mat-option>
                  </mat-select>
                  </mat-form-field>

Ts.

//get Countries
  fetchCountry(): void{
    this.std_service.getCountry()
    .subscribe(
      data => {
        this.CountryList = data;
        //console.log(this.CountryList);
      },
      error => {
        console.log(error);
      }
    )
  }

  onInputChange(e){
    console.log(e.value);
    this.std_service.getCitiesfromCountry(e.value)
      .subscribe(
        data => {
          this.CityList = data;
          console.log(this.CityList);
        },
        error => {
          console.log(error);
        }
      )
   }
daralbimvom
@daralbimvom:matrix.org
[m]
when using a span in a top mat-toolbar as a spacer with flex 1 1 auto, then the browser horizontal scroll bar appear and there is always a bit of unneeded white space after the toolbar
the only way i found to hide it so far is to add all element inside a div container with overflow-x: hidden; style
is there another solution ?
artart37
@artart37
Hi everyone, I am receiving this error when binding to a style: WARNING: sanitizing unsafe style value [object Object]
11 replies
Any ideas?
Flávio Oliveira
@wisespace-io
How do I localize with i18n a condition like: <b>{{ field.checked ? 'Yes' : 'No' }}</b>?
BertrandMarechal
@BertrandMarechal
put a *ngIf on the b tag, based on field.checked
then you'll have one tag with <b *ngIf="field.checked">Yes</b> the other one is <b *ngIf="!field.checked">No</b> and you can apply your i18n
Flávio Oliveira
@wisespace-io
Oh, that's smart :)
Pranav
@MarcusCS
In the index.html <app-root> is not loading it's content before javascript libraries are loaded
Ahsanbaloch
@Ahsanbaloch
which event should I use when there is a value in input or select list and it trigger?
Saudamini
@Saudamini_gitlab
Hi there.Can anyone tell me how to create indexedDb in angular
Yosi
@yosiasz
Dev
@CodeTropolis
Hello all - anyone have experience with cordova-plugin-purchase (v10.5.3)? I'm sing Angular v9, Ionic 5 with Firestore Cloud Function to validate receipt.
Nareth123
@Nareth123

Hello every one i have an question

i have component

<app-header></app-header>

Hello every one i have an question

i have component

<app-header></app-header>

<app-sidebar></app-sidebar>

<router-outlet></router-outlet>

i want to pass data from router-outlet to sidebar component

2 replies
BertrandMarechal
@BertrandMarechal
there are many ways to do that, as @webberig said you can use ngrx (or another state management), or store data in your services
Samuel Marks
@SamuelMarks
How do I use an @Input for a boolean without using []? I've tried scaleToContainer=1, scaleToContainer=true, and scaleToContainer="true" https://github.com/angular/material.angular.io/blob/41738f384aeb4a3a7aac111c9e84c685c6c452a4/src/app/shared/svg-viewer/svg-viewer.ts#L10
BertrandMarechal
@BertrandMarechal
@SamuelMarks You have to use the [] so that it does a proper binding, else it would see it as a string
Ijee
@Ijee
I got an ngFor that has a trackyByName on it. The problem is that I want to force animation on every element in the ngFor
when at least one changes. Is that possible somehow? I have to do it or the one element that will stay behind breaks the animation a bit and I can not fix in any other way
Ryan Ham
@superamadeus

Would it be possible to extend angular's build system with a webpack plugin that will transform a component's template before angular processes it?

Contrived example, given the following component template:

<div removeMe>This should be removed</div>
<div>There should be nothing above me</div>

I want to pre-process the template to remove the div div[removeMe] at compile time, before angular actually compiles the template.

Again, that is a simple, contrived example that can be emulated with directives, etc; but what I am trying to do must be done at compile time, and I want to do more complex transforms than just removing a div.

Does anyone have any suggestions, resources, etc that might help me on the path to figuring this out?

thomas-bee
@thomas-bee
We have been successfully using ngrx/store in the past. I like it despite the boilerplate, it provides conventions and a solid layer below the UI components. I wonder: is ngrx/store still considered state-of-the-art and can safely be used for future projects or are there other players worth considering (we are interfacing mostly to REST APIs using effects, potentially also to a few graphQL queries in the future).
3 replies
Kuth
@ezzhop
Hi, I am create a Angular Project with Django REST Framework API, my have organization properties, But I want to fetch the organization to be dynamic display org_logo and org_name on Sidebar when client click view their Organization detail, I have two components unrelated between organization detail component and sidebar component. How to fetch Organization data to display both detail and sidebar components at the same time?
Ahsanbaloch
@Ahsanbaloch

I want to update form but I am getting error of bad request. is there anyone who can guide me?
update method

// update Student
  private UpdateStudent(){

    this.std_service.UpdateStudent(this.id , this.form.value)
      .pipe(first())
      .subscribe({
         next: () => {
           this.router.navigate(['/home']);
           this.snackBar.open('Successfully Updated' , 'ok', {
            duration: 3000
          });
         },
         error: error => {
          this.snackBar.open(error , 'ok', {
            duration: 3000
          });
          this.loading = false;
          console.log(error);
          console.log(this.form.value);
         }
      });
  }

Service PUT method

 UpdateStudent(id : any, std: Student): Observable<Student[]>{
    const httpOption = { headers : new HttpHeaders({ 'Content-Type' : 'application/json'})};
    return this.http.put<Student[]>(this.APIUrl + `/Students/${id}`, std, httpOption);
  }
srinivasan-g
@srinivasan-g

Hi All, when I'm trying to upgrade angular 8 to 11. I have one issue, can please any one help me this issue. Error meesage below:

main.js:formatted:77430 Unhandled Promise rejection: Cannot read property 'deps' of undefined ; Zone: <root> ; Task: Promise.then ; Value: TypeError: Cannot read property 'deps' of undefined

oleic
@oleic
upgrading angular in smaller steps is usually the best idea
8 -> 9 -> 10 -> 11
take a look at https://update.angular.io
srinivasan-g
@srinivasan-g
Yes I followed angular doc
if any one came accross this issue please help me
tjmcdevitt
@tjmcdevitt
Hi All - I would like to add a current progress text to a view to let the users know data is processing in the Data Service. Is there a way to do that from the Data Service?
Luke Crooks
@crooksey

I have just upgraded a project from 11 to 12, and now get an error:


./node_modules/leaflet/dist/images/marker-icon.png:1:0 - Error: Module parse failed: Unexpected character '�' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)

I thought that with the CLI now you can't have a custom webpack config, so unsure how I would tie in additional loaders, can anyone help?

Eric Sellers
@djrerun
Hello all. Are async validators for reactive forms supposed to trigger when the form initially loads?
Victor Aprea
@vicatcu
something crazy seems to be happening

ngcc is failing with this:

Compiling @angular/compiler/testing : main as umd
Error: Error on worker #1: TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))

angular 11.2.14
all of a sudden
anyone have any insight?
User00015
@User00015

So I'm lost on a probably trivial problem. I have an element: <div *ngFor="let foo of foos$ | async> So I have an Observable of foos$ that I'm getting from the backend. The code in the component is "this.foos$ = this.myFooService.getFoos()" which returns an observable. This all works great.

But I also want a button that adds an empty foo to the list (or lets you delete a foo). So I have a button that calls addFoo() that looks like this:
addFoo(): void {
this.foos$ = this.foos$.pipe(
map( (data: any) => { return [...data, this.foo];
}
}

This works, but the *ngFor also throws up errors of "Cannot read property 'length' of null" So: What am I doing wrong? I just want a button that adds an empty foo to my observable.

Evan Nemerson
@nemequ
I'm very new to angular (not really a front-end developer), and I have a significant performance problem, which is ironic given the subject matter of the page I'm working on… anyways, I'm probably doing something dumb, but I'm not sure what. The site is at https://nemequ.github.io/waspr/ and the code is at https://github.com/nemequ/waspr/. As you can see, it takes a very long time to load. The data downloads quickly, the problem comes after I set a property (which, to be fair, contains all the data) on a component. I don't think it's that my templates are overly complicated; I actually saw the problem right away when my theme just output a simple string. If anyone who actually knows what they're doing could take a quick look I'd appreciate it.
Mile Mijatović
@mijatovicmile

Hello
I have one Angular related question
I have three buttons , 1. List, 2. Gallery and 3. Map
I want to achieve when I click on any of these buttons to display different content

How can I do that ?
when I click List button, Gallery and Map related content should be hidden
probably with *ngIf but I am not sure how to do that

4 replies
Can you help me
?
Mile Mijatović
@mijatovicmile
image.png