BartoszBilejczyk

<script>
import AppOffer from '../../AppOffer'

export default {
  props: {
    counter: {
      type: Number,
      default: 1
    }
  },

BartoszBilejczyk

<script>

export default {
  methods: {
    search() {
      console.log('Search')
    },
    addOffer(offer) {
      this.offers.push(offer);
    }

BartoszBilejczyk

<script>
import AppOffer from '../../AppOffer'

export default {
  props: {
    counter: {
      type: Number,
      default: 1
    }
  },

BartoszBilejczyk

<template lang="html">

  <div class="container">
    <div class="offers">
      <div 
        class="offer" 
        v-for="offer in offers"
      >
        <AppOffer :offer="offer"></AppOffer>
        

BartoszBilejczyk

npm install -g @angular/cli

ng new PROJECT-NAME
cd PROJECT-NAME
ng serve

// configuring default port

ng serve --host 0.0.0.0 --port 4201

BartoszBilejczyk

<template lang="html">

  <div class="container">
    <div class="offers">
      <div 
        class="item" 
        v-for="offer in offers"
      >
        <AppOffer :offer="offer"></AppOffer>
      <div>

BartoszBilejczyk

@import '../../assets/styles/main.scss';

.offer {
  position: relative;
  margin-top: 30px;
  min-height: 300px;
  padding: 20px;
  border: 1px solid palette(red, dark);
}

BartoszBilejczyk

<div class="container">
  <div class="offers">
    <div 
      class="offer" 
      *ngFor="let offer of offers"
    >
      <app-offer [offer]="offer"></app-offer>
      
      <button (click)="addOffer(offer)"></button>
    <div>

BartoszBilejczyk

<template lang="html">

  <button
    :class="{active: isActive, disabled: disabled}"
    :style="buttonStyles"
  ></button>

</template>

<script>

BartoszBilejczyk

import { Component, OnInit } from '@angular/core';
// other imports

@Component({
  selector: 'app-offer',
  templateUrl: './offer.component.html',
  styleUrls: ['./offer.component.scss']
})

export class HeaderComponent implements OnInit {