snics / ng2-avatar Goto Github PK

How can I make the avatar responsive?

Thanks.

• feature request

Give option to the user to Limit the number of Letters in the Avatar

Avatar sometimes shows multiple letters, It's better user can limit the number of letters showing in the Avatar.

like this

<avatar [name]="deal.opportunityName" numOfLetters="1" ></avatar>

I think there's a typo in the README.

You say

import { AvatarModule } from 'ng2-avatar';

@NgModule({
  declarations: [OtherComponent, ...],
  imports: [LibModule, ...], 
})
export class OtherModule {
}

It should be

import { AvatarModule } from 'ng2-avatar';

@NgModule({
  declarations: [OtherComponent, ...],
  imports: [AvatarModule, ...],  <<<---------
})
export class OtherModule {
}

It doesn't compile if missing

Thanks

When whe complete the email and name atributtes and the user doues not exists in Gravatar we get a 404 in console, If we what to use this component in a grid we will get a full console with 404 error, can be disabled the 404 response when gravatar not exists?

Bug Report or Feature Request (mark with an x)

- [X] bug report -> please search issues before submitting
- [ ] feature request

OS and Version?

Windows Server 2016

Versions

Angular CLI: 6.2.3
Node: 8.9.4
OS: win32 x64
Angular: 6.1.8
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package Version

@angular-devkit/architect 0.6.8
@angular-devkit/build-angular 0.6.8
@angular-devkit/build-optimizer 0.6.8
@angular-devkit/core 0.6.8
@angular-devkit/schematics 0.8.3
@angular/cdk 6.4.7
@angular/cli 6.2.3
@angular/material 6.4.7
@ngtools/webpack 6.0.8
@schematics/angular 0.8.3
@schematics/update 0.8.3
rxjs 6.3.2
typescript 2.9.2
webpack 4.8.3

npm 5.6.0

node v8.9.4

Repro steps

ng update @angular/core

The log given by the failure

Package "ng2-avatar" has an incompatible peer dependency to "@angular/core" (requires "^2.0.0" (extended), would install "6.1.9").
Package "ng2-avatar" has an incompatible peer dependency to "@angular/common" (requires "^2.0.0" (extended), would install "6.1.9").
Incompatible peer dependencies found. See above.

ng2 avatar code is printing the email address in the console. It will be great if we can remove console statement from the code.

Anyway to add the ability to update the background color, like after an a sync call to pull an object from the database that's storing a color attribute?

after we import to app module
`import { AvatarComponent } from 'ng2-avatar'
where shoud we put it
is it in declaration, import ...
if put under declaration, ng serve works but ng serve --prod fails

How do I change the font color

Bug Report or Feature Request (mark with an x)

- [ ] bug report -> please search issues before submitting
- [ ] feature request

OS and Version?

Versions

Repro steps

The log given by the failure

Desired functionality

Mention any other details that might be useful

Bug Report or Feature Request (mark with an x)

- [ x] bug report -> please search issues before submitting
- [ ] feature request

OS and Version?

OS : macOs HighSierra

Versions

Angular: 1.6.8
Node: local (8.9.4) cloud (6xx)
Npm: local 5.6.0 - cloud (4xx)

Repro steps

Deploying to cloud is not working!
Since node v6 does not support import and export statements, all js files of this module
should be transpiled to es5, and converting these syntax e.g from import to require..

The log given by the failure

Error: Error occurred while parsing your function triggers.

/Users/x/myproject/node_modules/ng2-avatar/module/component/avatar.component.js:2
import { Component, Input } from '@angular/core';
^^^^^^

SyntaxError: Unexpected token import
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:607:28)
    at Object.Module._extensions..js (module.js:654:10)
    at Module.load (module.js:556:32)
    at tryModuleLoad (module.js:499:12)
    at Function.Module._load (module.js:491:3)
    at Module.require (module.js:587:17)
    at require (internal/module.js:11:18)
    at Object.L0VR (/

Desired functionality

the module should not use import statement!
to support all nodes versions for SSR (server side rendering), the js files should be transpiled to es5 and use require instead of import statements...

note: here is a link on how I fixed similar issues...

Hi,

The plugin works great, just one small annoying thing..

https://github.com/snics/ng2-avatar/blob/master/src/avatar.component.ts#L60

For example when using Cordova and/or Ionic the Gravatar URL of the request will look like file://www.gravatar.com/avatar/...?s=40&d=404.
There may should be a check if http is used at all.

Hello,

I imported the AvatarModule in my root module but when I use it in one of my components I get this error. Any help would be great.

app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { HttpClientModule } from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { RouterModule, Routes } from '@angular/router';
import { InMemoryWebApiModule } from 'angular-in-memory-web-api';

import 'hammerjs';

import { FuseFakeDbService } from './fuse-fake-db/fuse-fake-db.service';
import { SharedModule } from './core/modules/shared.module';
import { AppComponent } from './app.component';
import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar';
import { FuseMainModule } from './main/main.module';
import { FuseSplashScreenService } from './core/services/splash-screen.service';
import { FuseConfigService } from './core/services/config.service';
import { FuseSampleModule } from './main/content/sample/sample.module';
import { FuseChatModule } from './chat/chat.module';
import { AgentloginModule } from './agentlogin/agentlogin.module';
import { SocketService } from './socket.service';
import { SharedService } from './shared.service';
import { LokiService } from 'angular2-loki';
import { DatabaseService } from './database.service';
import { AvatarModule } from "ng2-avatar";
const appRoutes: Routes = [

    {
        path: '',
        redirectTo: '/login',
        pathMatch: 'full'

    }
];

@NgModule({
    declarations: [
        AppComponent],
    imports: [
        BrowserModule,
        FormsModule,
        ReactiveFormsModule,
        HttpModule,
        HttpClientModule,
        BrowserAnimationsModule,
        AvatarModule.forRoot(),
        RouterModule.forRoot(appRoutes),
        SharedModule,
        InMemoryWebApiModule.forRoot(FuseFakeDbService, { delay: 125 }),
        PerfectScrollbarModule.forRoot(),
        FuseMainModule,
        FuseSampleModule,
        FuseChatModule,
        AgentloginModule
    ],
    providers: [
        FuseSplashScreenService,
        FuseConfigService,
        SocketService,
        SharedService,
        LokiService,
        DatabaseService
    ],
    bootstrap: [
        AppComponent
    ]
})
export class AppModule {
}

chat-view.component.html: where I want to use
<avatar [name]="user.userFullname" [displayType]="'circle'"></avatar>

the error :