Image src based on parse information


So I’m making parse application. I’m parsing information from I can show the content in app. Only thing that is bothering me is that some posts don’t have image and then I get border with no image in it. So what I’m trying to do is to load some other image as a “default one” (from internet perhaps) when there is no image near reddit post. I tried something with *nfIf and ng-switch but nothing worked. Here is the code:


    <ion-title>Reddit news</ion-title>

<ion-content padding>
      <ion-label fixed>Category</ion-label>
        <ion-select (ionChange)="changeCategory()" [(ngModel)]="category" name="category">
          <ion-option value="artificial">Artificial inteligence</ion-option>
          <ion-option value="TechNewsToday">Techonology</ion-option>
          <ion-option value="gamernews">Gaming</ion-option>

    <ion-item *ngFor = "let item of items" text-wrap>
      <ion-thumbnail *ngIf="" item-left>
        <img  ng-switch-default src="{{}}">
      <h2 class="wrap item-text-wrap">{{}} </h2>
      <p class="wrap item-text-wrap" style="word-wrap: break-word; word-break: break-all;">
        <ion-icon name="person" item-left>{{}}</ion-icon>
        <ion-icon name="thumbs-up">{{}}</ion-icon>&nbsp;&nbsp;
        <ion-icon name="chatboxes">{{}}</ion-icon>       
      <a ion-button block target="_blank" href="{{}}">VIEW ON REDDIT</a>



import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import {MyRedditApi} from '../../providers/my-reddit-api';

  Generated class for the Reddits page.

  See for more info on
  Ionic pages and navigation.
  selector: 'page-reddit',
  templateUrl: 'reddit.html',
  providers: [MyRedditApi]

export class RedditPage {
	items: any;

  constructor(public navCtrl: NavController, public navParams: NavParams, private redditProvider: MyRedditApi) {}

  ionViewDidLoad() {
    this.getPosts(this.category, this.limit);

    this.category = 'artificial';
    this.limit = 30;

  getPosts(category, limit){
  	this.redditProvider.getPosts(category, limit).subscribe(response => {
  		this.items =;

    this.limit = 30;
    this.getPosts(this.category, this.limit);



import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';

  Generated class for the MyReddit provider.

  for more info on providers and Angular 2 DI.
export class MyRedditApi {
	http: any;
	baseUrl: String;

  constructor(http: Http) {
  	this.http = http;
  	this.baseUrl = "";
    //console.log('Hello MyReddit Provider');

  getPosts(category, limit){
    console.log (this.baseUrl + '/' + category + '/.json?limit='+limit);
  	return this.http.get(this.baseUrl + '/' + category + '/.json?limit='+limit)
  	.map(res => res.json()); 



I would try something like this:

<img [src]=" ? : fallbackImage">

…and define fallbackImage as a URL property in the controller.


// try this below code…

   <ion-thumbnail item-left><img src="">


     <ion-thumbnail  item-left> <img   [src]="{{}}">