simplifying things with mock data - removed unnecessary entity relations

src/app/theme/msgCenter/msgCenter.component.ts

@@ -8,102 +8,80 @@ import {ProfilePicturePipe} from '../pipes/image/profile-picture.pipe';
     pipes: [ProfilePicturePipe]
 })
 export class MsgCenter  {
-  users = {
-    0: {
-      name: 'Vlad'
-    },
-    1: {
-      name: 'Kostya'
-    },
-    2: {
-      name: 'Andrey'
-    },
-    3: {
-      name: 'Nasta'
-    }
-  };
 
   notifications = [
     {
-      userId: 0,
+      name: 'Vlad',
-      template: '&name posted a new article.',
+      text: 'Vlad posted a new article.',
       time: '1 min ago'
     },
     {
-      userId: 1,
+      name: 'Kostya',
-      template: '&name changed his contact information.',
+      text: 'Kostya changed his contact information.',
       time: '2 hrs ago'
     },
     {
       image: 'assets/img/shopping-cart.svg',
-      template: 'New orders received.',
+      text: 'New orders received.',
       time: '5 hrs ago'
     },
     {
-      userId: 2,
+      name: 'Andrey',
-      template: '&name replied to your comment.',
+      text: 'Andrey replied to your comment.',
       time: '1 day ago'
     },
     {
-      userId: 3,
+      name: 'Nasta',
-      template: 'Today is &name\'s birthday.',
+      text: 'Today is Nasta\'s birthday.',
       time: '2 days ago'
     },
     {
       image: 'assets/img/comments.svg',
-      template: 'New comments on your post.',
+      text: 'New comments on your post.',
       time: '3 days ago'
     },
     {
-      userId: 1,
+      name: 'Kostya',
-      template: '&name invited you to join the event.',
+      text: 'Kostya invited you to join the event.',
       time: '1 week ago'
     }
   ];
 
   messages = [
     {
-      userId: 3,
+      name: 'Nasta',
       text: 'After you get up and running, you can place Font Awesome icons just about...',
       time: '1 min ago'
     },
     {
-      userId: 0,
+      name: 'Vlad',
       text: 'You asked, Font Awesome delivers with 40 shiny new icons in version 4.2.',
       time: '2 hrs ago'
     },
     {
-      userId: 1,
+      name: 'Kostya',
       text: 'Want to request new icons? Here\'s how. Need vectors or want to use on the...',
       time: '10 hrs ago'
     },
     {
-      userId: 2,
+      name: 'Andrey',
       text: 'Explore your passions and discover new ones by getting involved. Stretch your...',
       time: '1 day ago'
     },
     {
-      userId: 3,
+      name: 'Nasta',
       text: 'Get to know who we are - from the inside out. From our history and culture, to the...',
       time: '1 day ago'
     },
     {
-      userId: 1,
+      name: 'Kostya',
       text: 'Need some support to reach your goals? Apply for scholarships across a variety of...',
       time: '2 days ago'
     },
     {
-      userId: 0,
+      name: 'Vlad',
       text: 'Wrap the dropdown\'s trigger and the dropdown menu within .dropdown, or...',
       time: '1 week ago'
     }
   ];
-
-  getMessage(msg) {
-    var text = msg.template;
-    if (msg.userId || msg.userId === 0) {
-      text = text.replace('&name', '<strong>' + this.users[msg.userId].name + '</strong>');
-    }
-    return text;
-  };
 }

src/app/theme/msgCenter/msgCenter.html

@@ -16,10 +16,9 @@
       </div>
       <div class="msg-list">
         <a *ngFor="#msg of notifications" href class="clearfix" >
-          <div class="img-area"><img [ngClass]="{'photo-msg-item': !msg.image}" src="{{ ( msg.image ||  (users[msg.userId].name | profilePicture)) }}"></div>
+          <div class="img-area"><img [ngClass]="{'photo-msg-item': !msg.image}" src="{{ ( msg.image ||  (msg.name | profilePicture)) }}"></div>
           <div class="msg-area">
-            <div [innerHTML]="getMessage(msg)"></div>
+            <div>{{ msg.text }}</div>
-
             <span>{{ msg.time }}</span>
           </div>
         </a>
@@ -41,7 +40,7 @@
       </div>
       <div class="msg-list">
         <a *ngFor="#msg of messages" href class="clearfix">
-          <div class="img-area"><img [ngClass]="{'photo-msg-item': !msg.image}" src="{{ ( msg.image ||  (users[msg.userId].name | profilePicture)) }}"></div>
+          <div class="img-area"><img [ngClass]="{'photo-msg-item': !msg.image}" src="{{ ( msg.image ||  (msg.name | profilePicture)) }}"></div>
           <div class="msg-area">
             <div>{{ msg.text }}</div>
             <span>{{ msg.time }}</span>