Skip to content

Instantly share code, notes, and snippets.

@JaimeStill
Created September 27, 2017 13:01
Show Gist options
  • Save JaimeStill/6fe79de23f6ea61cb316e122409f93f8 to your computer and use it in GitHub Desktop.
Save JaimeStill/6fe79de23f6ea61cb316e122409f93f8 to your computer and use it in GitHub Desktop.
Forms without forms
<md-toolbar>Start Building</md-toolbar>
<section>
<md-input-container>
<input mdInput placeholder="Name" [(ngModel)]="test.model.name">
</md-input-container>
</section>
<button md-button (click)="test.addData()">Add Data</button>
<section *ngFor="let d of test.model.data; let i = index" [style.background-color]="i % 2 === 0 ? '#555' : '#222'">
<md-input-container>
<input mdInput placeholder="Name" [(ngModel)]="d.name">
</md-input-container>
<md-input-container>
<input mdInput placeholder="Description" [(ngModel)]="d.description">
</md-input-container>
<button md-icon-button (click)="test.removeData(i)" color="warn"><md-icon>delete</md-icon></button>
</section>
import { Component } from '@angular/core';
import { TestService } from '../../services/test.service';
@Component({
selector: 'home',
templateUrl: './home.component.html',
providers: [
TestService
]
})
export class HomeComponent {
constructor(public test: TestService) {
for (let i = 0; i < 5; i++) {
console.log(`i % 2 = ${i % 2}`);
}
}
}
export class TestData {
id: number;
name: string;
description: string;
}
import { TestData } from './test-data.model';
export class Test {
id: number;
name: string;
data: Array<TestData>;
constructor() {
this.data = new Array<TestData>();
this.data.push(new TestData());
this.data.push(new TestData());
this.data.push(new TestData());
}
}
import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
import { Test } from '../models/test.model';
import { TestData} from '../models/test-data.model';
@Injectable()
export class TestService {
model = new Test();
addData() {
this.model.data.push(new TestData());
}
removeData(index: number) {
this.model.data.splice(index, 1);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment