philipszdavido

//src/components/linktext/linktext.component.ts
import { Component, OnInit, Input } from '@angular/core';

@Component({
  selector: 'app-linktext',
  templateUrl: './linktext.component.html',
  styleUrls: ['./linktext.component.css']
})
export class LinktextComponent implements OnInit {

philipszdavido

//src/app/components/points/points.component.html
<a href="#" class="label label-success link-black btn btn-sm">
    <i class="fa fa-gift margin-r-5"></i> Points ({{points}})
</a>

philipszdavido

//src/app/components/points/points.component.ts
import { Component, OnInit, Input } from '@angular/core';

@Component({
  selector: 'app-points',
  templateUrl: './points.component.html',
  styleUrls: ['./points.component.css']
})
export class PointsComponent implements OnInit {

philipszdavido

//src/spp/components/link/link.component.html
<!-- Post -->
<div class="post">
    <app-linktext [titletext]='article.title' [linktext]='article.link'> </app-linktext>
    <app-votelink [points]='article.points' (upvote)='upvote($event)' (downvote)='downvote($event)'></app-votelink>
    <hr />
</div>
<!-- /.post -->

philipszdavido

//src/spp/components/link/link.component.ts
import { Component, OnInit, Input } from '@angular/core';
import * as fromArticle from '../../redux/reducer'
import * as fromAction from '../../redux/actions/articles'
import { Article } from '../../redux/models/article';
import { Store } from '@ngrx/store'

@Component({
  selector: 'app-link',
  templateUrl: './link.component.html',

philipszdavido

import * as fromArticle from '../../redux/reducer'
import * as fromAction from '../../redux/actions/articles'
import { Article } from '../../redux/models/article';
import { Store } from '@ngrx/store'
//inject the Store inside your components constructor
constructor(private store: Store<fromArticle.State>) { }

philipszdavido

<app-linktext [titletext]='article.title' [linktext]='article.link'> </app-linktext>
<app-votelink [points]='article.points' (upvote)='upvote($event)' (downvote)='downvote($event)'></app-votelink>

philipszdavido

upvote = () => {
    this.store.dispatch(new fromAction.IncrementArticlePointAction(this.article))
  }

philipszdavido

downvote = () => {
    this.store.dispatch(new fromAction.DecrementArticlePointAction(this.article))
}

philipszdavido

//src/app/components/linklist/linklist.component.ts
import { Component, OnInit, Input } from '@angular/core';
import { Article } from '../../redux/models/article';

@Component({
  selector: 'app-linklist',
  templateUrl: './linklist.component.html',
  styleUrls: ['./linklist.component.css']
})
export class LinklistComponent implements OnInit {