Skip to content

Instantly share code, notes, and snippets.

@andreisebastianc
Last active October 10, 2016 09:26
Show Gist options
  • Save andreisebastianc/87f0cf0e8ed095a1e891d7335630081f to your computer and use it in GitHub Desktop.
Save andreisebastianc/87f0cf0e8ed095a1e891d7335630081f to your computer and use it in GitHub Desktop.

Revisions

  1. andreisebastianc revised this gist Oct 10, 2016. 1 changed file with 27 additions and 0 deletions.
    27 changes: 27 additions & 0 deletions app.component.ts
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,27 @@
    import {
    Component
    } from "@angular/core";

    interface User {
    name: string;
    image: string;
    fullname: string;
    }

    @Component({
    selector: 'app',
    template: `
    <div class="app-wrapper">Hi, I'm working!</div>
    <user-profile [profile]="user"></user-profile>
    `
    })
    export class App {
    user: User
    constructor() {
    this.user = {
    name:"test",
    image:"/public/default-user-profile.jpg",
    fullname: "test test test"
    };
    }
    }
  2. andreisebastianc created this gist Oct 10, 2016.
    27 changes: 27 additions & 0 deletions user-profile.ts
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,27 @@
    import {
    Component,
    Input
    } from '@angular/core';

    interface Profile {
    name: string;
    image: string;
    }

    @Component({
    selector: 'user-profile',
    template: `
    <div *ngIf="profile">
    <div class="profile">
    <img
    class="profile-image"
    src={{profile.image}}
    />
    <span class="profile-name">{{profile.name}}</span>
    </div>
    </div>
    `
    })
    export class UserProfileComponent {
    @Input() profile: Profile;
    }