Skip to content

Instantly share code, notes, and snippets.

View jorgeucano's full-sized avatar

Jorge Cano jorgeucano

505 followers · 26 following
View GitHub Profile
@jorgeucano
jorgeucano / post-page.component.ts
Created August 23, 2016 00:12
import { Component, OnInit } from '@angular/core';
import { AngularFire, FirebaseListObservable } from 'angularfire2';
import { Observable } from 'rxjs/Observable';
import { RouteParams } from '@ngrx/router';
import 'rxjs/add/operator/pluck';
@Component({
moduleId: module.id,
@jorgeucano
jorgeucano / app.module.ts
Created December 23, 2016 13:59
angular material example, import module of angularmaterial
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { AppComponent } from './app.component';
// imports material
import { MaterialModule } from '@angular/material';
@jorgeucano
jorgeucano / app.module.ts
Created December 23, 2016 14:18
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { AppComponent } from './app.component';
// imports material
import { MaterialModule } from '@angular/material';
@jorgeucano
jorgeucano / app.module.ts
Created December 23, 2016 14:18
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { AppComponent } from './app.component';
// imports material
import { MaterialModule } from '@angular/material';
@jorgeucano
jorgeucano / tsconfig.json
Created December 23, 2016 14:19
{
"compilerOptions": {
"baseUrl": "",
"declaration": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": ["es6", "dom"],
"mapRoot": "./",
"module": "es6",
"moduleResolution": "node",
@jorgeucano
jorgeucano / index.html
Created December 23, 2016 14:19
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>ProbandoMaterial</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
@jorgeucano
jorgeucano / checkbox.html
Created December 23, 2016 14:27
<md-card>
<md-card-content>
<h2 class="example-h2">Checkbox configuration</h2>
<section class="example-section">
<md-checkbox class="example-margin" [(ngModel)]="checked">Checked</md-checkbox>
<md-checkbox class="example-margin" [(ngModel)]="indeterminate">Indeterminate</md-checkbox>
</section>
<section class="example-section">
@jorgeucano
jorgeucano / inputs.html
Created December 23, 2016 14:29
<h1>Inputs</h1>
<form class="example-form">
<md-input-container class="example-full-width">
<input md-input placeholder="Company (disabled)" disabled value="Google">
</md-input-container>
<table class="example-full-width" cellspacing="0"><tr>
<td><md-input-container class="example-full-width">
<input md-input placeholder="First name">
</md-input-container></td>
@jorgeucano
jorgeucano / grid-list.html
Created December 23, 2016 14:57
<md-grid-list cols="4" rowHeight="100px">
<md-grid-tile
*ngFor="let tile of tiles"
[colspan]="tile.cols"
[rowspan]="tile.rows"
[style.background]="tile.color">
{{tile.text}}
</md-grid-tile>
</md-grid-list>
@jorgeucano
jorgeucano / dynamic-grid.ts
Created December 23, 2016 14:58
tiles = [
{text: 'One', cols: 3, rows: 1, color: 'lightblue'},
{text: 'Two', cols: 1, rows: 2, color: 'lightgreen'},
{text: 'Three', cols: 1, rows: 1, color: 'lightpink'},
{text: 'Four', cols: 2, rows: 1, color: '#DDBDF1'},
];