Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
mogo-edenpark
@mogo-edenpark
General question guys.
git checkout master
git merge new-feature
git branch -d new-feature
as you see why do they delete new features after merging it? it's from Atlassian doc
Miloš Lapiš
@mlc-mlapis
@mogo-edenpark Because the feature is finished and incorporated into the master.
Famous
@famousmighodaro
Refused to load the image 'http://localhost:8100/favicon.ico' because it violates the following Content Security Policy directive: "default-src 'none'". Note that 'img-src' was not explicitly set, so 'default-src' is used as a fallback.

Refused to load the font '<URL>' because it violates the following Content Security Policy directive: "default-src 'none'". Note that 'font-src' was not explicitly set, so 'default-src' is used as a fallback.
Please help, I got this error from browser console after I ng add angular-calendar. Now my code do not work a again
Syed Abdul Aala
@syedabdulaala
I have two component and each component have their own service instance which I achieved by providing provider in component decorator. Now I have a requirement where I have to create one component dynamically using component factory resolver but I don't want component to create the instance but instead use then value I have provided, I tried to achieve this by override the the injector like in code snippet below, but it's not working, it is always creating new service instance
const resolver = this.componentFactoryResolver.resolveComponentFactory( MultipleChoiceComponent ); const injector = Injector.create({ parent: this.injector, providers: [ { provide: MultipleChoiceService, useValue: this.dataEntryService.multipleChoiceService } ] }); this.dynTypeHost.createComponent(resolver, 0, injector);
Kamran Bahadori
@bahadorik
Hi all, I have a challenging problem, I have n angular2 (10) projects developed separately. To avoid performance problems, duplicated dependencies etc. I would like to make a single build as if it were a single project, but I don't want to drastically change the structure of these projects for example by creating sub-projects. do you think Module Federation could solve this problem? Anyone have any suggestions / experience?
Miloš Lapiš
@mlc-mlapis
@famousmighodaro It's somehow related to Content-Security-Policy (CSP), so what do you in <meta http-equiv="Content-Security-Policy" ... >
https://developers.google.com/web/fundamentals/security/csp
Miloš Lapiš
@mlc-mlapis
@syedabdulaala You would need to use probably useFactory (you have deps options) on a component level to set the providers more dynamically.
@bahadorik Migrate to Nx monorepo.
cuznerdexter
@cuznerdexter

Hi,
Is it possible to make a directive required in a component?
We have various common components that all need to make use of a directive.
I want to make sure the developer is alerted if the directive is not applied during coding.

I was hoping to use something like an interface, but don’t know if it is possible.
Any ideas anyone??
Thanks.

Miloš Lapiš
@mlc-mlapis
@cuznerdexter Use your linter functionality and create your custom rules to check this and other similar cases.
@cuznerdexter Then it's not necessary to create some fixed and complicated code on the components level.
Saudamini
@Saudamini_gitlab
Hi all.I need some idea to get the week range of a given month.
Please help me if anyone have done this
Stack 0
@StekovicN_twitter
offtopic question related to chrome... doing virtual scroll on top of angular material tables inside angular app, trying to see the limits of what would be the top in case of results that i could show. Everything works fine on UI for 1.25 milion records. If i get 1.4 milion records (ye i know, don't ask me why i'm doing this instead of going with pagination), i get null as response inside chrome. It downloads payload of 600mb which is fine but response shows null and i guess chrome just can't handle it. I checked 1.4 milion in firefox and it does good with that large set. Anything regarding that or someone had similar situation to deal with?
Stack 0
@StekovicN_twitter
tried web workers, still the same... if i hit url as plain request from within new tab, i get response... of course it takes some time but eventually it loads
MeetupFeed
@MeetupFeedio_twitter

Hello guys,

We're here with December's most interesting Angular meetup videos. You'll learn about module federation, hosting apps on Firebase, using Prettier for style guides and auto formatting. There's also a comparison of different rendering methods SSR (using Angular Universal) and Jamstack, a video about Cypress for fast end-to-end testing and Deno (a secure runtime for JavaScript and TypeScript) as well!

Believe us, it's worth checking out!

See for yourself here: https://blog.meetupfeed.io/angular-meetup-videos-december-2020/

Regards,
MeetupFeed

aquinn637
@aquinn637

Hi all, why would this not work in a template?

[isEnabled]="typeof image_data === 'string'"

    <Button
        class="btn-primary p-10"
        text="{{ 'clock' | translate }}"
        (tap)="clock()"
        [isEnabled]="typeof image_data === 'string'"
    ></Button>
Miloš Lapiš
@mlc-mlapis
Famous
@famousmighodaro
@mlc-mlapis at the moment I don't have <meta http-equiv="Content-Security-Policy" ... >, I am reading the link you attached to answer.
Doaa Othman
@DoaaOthman
Hi all, please I want to sharing local angular libraries without npm with my other project how can I do that
Miloš Lapiš
@mlc-mlapis
@DoaaOthman You can use Nx monorepo.
Doaa Othman
@DoaaOthman
@mlc-mlapis please could you give me suggestions of tutorial videos about it
Krishna
@krishyalla_twitter
Did anyone used the ng-packagr for inline css?
Krishna
@krishyalla_twitter
I am using background image url in my scss want to convert from svg to base 64 url .I wanted to try this https://github.com/ng-packagr/ng-packagr/blob/master/docs/embed-assets-css.md
somehow it is not working as expected
Doaa Othman
@DoaaOthman
@mlc-mlapis thanks a lot
alenandry
@alenandry
@itsmenabil
function multiply(a , b){
return a * b
}
shivam kumar
@Shiva7071007

Hi,
While I am debugging an angular app in vscode, my debugger is sometime stop in file \localhost:4200\main.js which is a minified file.
the debugger then hang up because of size of this file.

How can I add this file in skipfile list inside launch.json?? I tried adding its path but its not working.
my launch.json:

{
      "name": "Launch Edge",
      "request": "launch",
      "type": "pwa-msedge",
      "url": "http://localhost:4200",
      "webRoot": "${workspaceFolder}",
      "sourceMaps": true,
      "skipFiles": [
        "${workspaceFolder}/node_modules/**/*.js",
        "${workspaceFolder}/node_modules/**/*.es6.js",
        "${workspaceFolder}/node_modules/",
        "<node_internals>/**/*.js",
        "${workspaceFolder}/lib/**/*.js",
        "\\localhost:4200\\main.js"
      ]
}
itsmenabil
@itsmenabil
@mogo-edenpark @alenandry thanks bros, very appreciated...
Andrés Pérez
@Oxyrus
image.png

Why is Angular building the same link for these 2 routerLinks?

<a [routerLink]="['./create']">

And

<a [routerLink]="['../../create']">

The second should build a different link, but they are the same right now

Laxmi Gurung
@grgsamrita
Hi there,
i am working on a web app where I have been using angular as a front-end. I need to implement a mechanism when the user should receive a popup notification not like browser popup notification but for the app itself like logs. I have implemented before by fetching the server API periodically from the client side.
is there a better way where i do not have to periodically fetch data?
my backend developers are using python for the server
Miloš Lapiš
@mlc-mlapis
@grgsamrita Maybe PWA mode can solve it for your.
Famous
@famousmighodaro

Hi all, I have an array of objects which have properties start, date and title from firestore, the start and end are both timestamp, and I am having problem grouping the items which have the same day together in the view. I try to add start date to a separate array. I then compared the startDate with the object array and display the item that has start with the startDate but still not working. Please what I am doing wrong.

 scheduleViewChange(ev: CustomEvent<SegmentChangeEventDetail>) {
    if (ev.detail.value === "day") {
      this.scheduleService.getTodaySchedule().subscribe((values: ISchedule[]) => {
        this.events = values;
      });
      return;
    }
    this.scheduleService.getThisWeekSchedule().subscribe(values => {
      this.startDates = [];
      this.events = values;
      values.forEach(value => {
        this.startDates.push(value.start);
      });
    });
  }

the template

<div *ngFor="let startDate of startDates">
          <h2>{{startDate * 1000 |date: "mediumDate"}}</h2>
          <ion-list *ngFor="let event of events" class="ion-no-margin" #scheduleDay>
            <ion-item class="ion-no-margin" *ngIf="startDate===event.start">
              <label>
                <h4>{{event.title}}</h4>
                <small class="ion-margin-end">Start: {{event.start.seconds*1000 | date: "shortTime" }}</small>
                <small class="ion-margin-start">End: {{event.end.seconds*1000 | date: "shortTime" }}</small>
              </label>
            </ion-item>
          </ion-list>
        </div>
Matt Erman
@CodeLiftSleep
Working on setting up our data store to use ngRx entity but having an issue because of the way the data needs to be set up for use...currently am getting data back in this format: [{id: 1, amount: 5}, {id: 2, amount: 7}] but for ngRx entity it appears to need the data in the following format: [ 0: {id: 1, amount: 5}, 1: {id: 2, amount: 7}] . Since changing every stored procedure/ controller on the backend is not in the cards to enable this change, is there a way to map this properly on the front end when the data comes back before it tries to use it via ngRx entity?
cuznerdexter
@cuznerdexter

Help! Anyone know why my Angular Jest Tests are reporting
error TS2593: Cannot find name 'describe’. ??
I have an NWL NX Workspace running an Angular App (arm-web-core) & Multiple Libs.
The tests in all the Libs are running fine.
The tests in the App are all reporting this error.
I have not edited the config - so these should be the config from the NX setup.
How do I fix this?? Any ideas?

App TsConfigs:
// tsconfig.json

{
  "extends": "../../tsconfig.base.json",
  "compilerOptions": {
    "typeRoots": ["node_modules/@types"],
    "types" : ["node"],
  },
  "files": [],
  "include": [],
  "references": [
    {
      "path": "./tsconfig.app.json"
    },
    {
      "path": "./tsconfig.spec.json"
    },
    {
      "path": "./tsconfig.editor.json"
    }
  ]
}

// tsconfig.app.json

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "../../dist/out-tsc",
    "typeRoots": ["node_modules/@types"],
    "types" : ["node"],
  },
  "files": ["src/main.ts", "src/polyfills.ts"]
}

// tsconfig.spec.json

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "../../dist/out-tsc",
    "module": "commonjs",
    "types": ["jest", "node"]
  },
  "files": ["src/test-setup.ts"],
  "include": ["**/*.spec.ts", "**/*.d.ts"]
}
ArtemRudenko
@artemrudenko
try add jest to tsconfig types:
"compilerOptions": {
    "typeRoots": ["node_modules/@types"],
    "types" : ["node", "jest"],
  },
cuznerdexter
@cuznerdexter
Thanks - will try it.
cuznerdexter
@cuznerdexter
Still not working
cuznerdexter
@cuznerdexter

So this did not work for me:

"compilerOptions": {
    "typeRoots": ["node_modules/@types"],
    "types" : ["node", "jest"],
  },

But this did: ???

"compilerOptions": {
  },
No Idea why though.
So now my App tests are running, and my Lib tests are running. :)
Xava\du
@xavadu_twitter

Performance question:

I started to move stream for state mangment to call to the function to get a snapshots specially when several component depends on one stream.

ie. (PoC)

someService.date$  // exposed

someService.getStateSnapshot()

someService.updateDate(newDate) {
   this.state.date = newDate;
   this.dateDispatch(this.state.date = newDate);  // emit date$
}

now the question is... if in a component which consume this service I need the date for two component in it template, which have better performance:

  1. Make the service public and consume it (which is call in each change detection

    <cmp-a [date]="someService.getStateSnapshot().date"></cmp-a>
    <cmp-b [date]="someService.getStateSnapshot().date"></cmp-b>
  2. Async in both place (the *ngIF technique can't be used to share an async)

    <cmp-a [date]="date$ | async"></cmp-a>
    <cmp-b [date]="date$ | async"></cmp-b>
  3. Subscribe in the main component like

// Main component
someService.date$.subscribe(date => this.date = date);

// Template
<cmp-a [date]="date"></cmp-a>
<cmp-b [date]="date"></cmp-b>

or really it is not a diference?