title: Codility like button angular
body: <p>Hi I have a problem with the codility exercises on the square, I am trying to do something 2 days and nothing anyone has a solutions</p>
  <p>Build a like button component using Angular (v4). Export the like button component as &quot;LikeButtonComponent&quot; (export class LikeButtonComponent).</p>
  <p>Requirements:</p>
  <p>There should be a like button:
  The content of the like button should be in the following format: &quot;Like | 100&quot;, where 100 is the total number of likes.
  It should have a &quot;like-button&quot; class.
  Wrap the number of likes in a span with a &quot;likes-counter&quot; class.
  The initial number of likes in the counter should be 100.</p>
  <p>Users can add a like. By clicking the button:
  The number of likes should increase by one.
  Like button should have &quot;liked&quot; class in addition to the &quot;like-button&quot; class.</p>
  <p>Users can undo their like by clicking again on the button:
  The counter should decrease by one.
  &quot;liked&quot; class should be removed.</p>
  <p>And code</p>
  <pre><code>import { Component, Injectable } from '@angular/core';
  
  @Component({
      selector: 'like-button',
      template: `
          &lt;h2&gt;
            &lt;span
    &gt;&lt;button (click)=&quot;buttonCliked()&quot;&gt;Like |{{ likebutton.likeCounter }}&lt;/button&gt;&lt;/span
  &gt;
          &lt;/h2&gt;
      `,
      styles: [`
          .like-button {
              font-size: 1rem;
              padding: 5px 10px;
              color:  #585858;
          }
  
          .liked {
              font-weight: bold;
              color: #1565c0;
          }
      `]
  })
  
  export class LikeButtonComponent {
  
    public likeCounter = 100;
  
    constructor(private likeButton: LikeButton, private liked: Liked) {}
  
    buttonCliked(): void {
      this.changeLikeNumber();
      this.toggleLike();
    }
  
    private toggleLike(): void {
      this.liked.isLiked = !this.liked.isLiked;
    }
  
    private changeLikeNumber(): void {
      if (!this.liked.isLiked) {
        this.likeCounter = this.likeButton.increment(this.likeCounter);
      } else {
        this.likeCounter = this.likeButton.decrement(this.likeCounter);
      }
    }
  }
  
  export class LikeButton {
    constructor(private liked: Liked) {}
    increment(likeCounter: number) {
      likeCounter++;
  
      return likeCounter;
    }
    decrement(likeCounter: number) {
      likeCounter--;
      return likeCounter;
    }
  }
  
  export class Liked {
    isLiked = false;
  }
  </code></pre>