创建默认头像、头像尺寸指令

src/app/directives/avatar-error.directive.ts

@@ -0,0 +1,28 @@
+import { Directive, Input, HostListener } from '@angular/core';
+const singleAvatarErrorIcon = '../../../assets/images/single-avatar.svg';
+const groupAvatarErrorIcon = '../../../assets/images/group-avatar.svg';
+
+/**
+ * 群组或单聊默认头像
+ */
+
+@Directive({ selector: '[avatarError]' })
+
+export class AvatarErrorDirective {
+    @Input()
+        private avatarError;
+    constructor() {
+        //    pass
+    }
+    @HostListener('error', ['$event']) private onError(event) {
+        /**
+         * group    1
+         * single   0
+         */
+        if (this.avatarError === 1) {
+            event.target.src = groupAvatarErrorIcon;
+        } else if (this.avatarError === 0) {
+            event.target.src = singleAvatarErrorIcon;
+        }
+    }
+}

src/app/directives/avatar-error.module.ts

@@ -0,0 +1,20 @@
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { NgModule } from '@angular/core';
+import { AvatarErrorDirective } from './avatar-error.directive';
+
+@NgModule({
+    declarations: [
+        AvatarErrorDirective
+    ],
+    imports: [
+        CommonModule,
+        FormsModule
+    ],
+    exports: [
+        AvatarErrorDirective
+    ],
+    providers: []
+})
+
+export class AvatarErrorModule {}

src/app/directives/avatar-load.directive.ts

@@ -0,0 +1,17 @@
+import { Directive, HostListener } from '@angular/core';
+import { Util } from '../services/util';
+
+/**
+ * 对头像的宽高进行限制
+ */
+
+@Directive({ selector: '[avatarLoad]' })
+
+export class AvatarLoadDirective {
+    constructor() {
+        //    pass
+    }
+    @HostListener('load', ['$event']) private onLoad(event) {
+        Util.reduceAvatarSize(event);
+    }
+}

src/app/directives/avatar-load.module.ts

@@ -0,0 +1,20 @@
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { NgModule } from '@angular/core';
+import { AvatarLoadDirective } from './avatar-load.directive';
+
+@NgModule({
+    declarations: [
+        AvatarLoadDirective
+    ],
+    imports: [
+        CommonModule,
+        FormsModule
+    ],
+    exports: [
+        AvatarLoadDirective
+    ],
+    providers: []
+})
+
+export class AvatarLoadModule {}