Skip to content

Instantly share code, notes, and snippets.

@iksose
Created January 11, 2016 15:05
Show Gist options
  • Save iksose/5dd615378ad781ab7dea to your computer and use it in GitHub Desktop.
Save iksose/5dd615378ad781ab7dea to your computer and use it in GitHub Desktop.
import {Component, View, Input, Output, EventEmitter} from 'angular2/core';
import {NgFor, NgClass, NgIf} from 'angular2/common';
import {ROUTER_DIRECTIVES} from 'angular2/router';
import template from './editable.html';
import styles from './editable.css';
import * as alerts from 'Utils/alerts'
const headers = {
'Authorization': (()=>getJWT())(),
'Accept': 'application/json, text/plain, */*',
'Content-Type': 'application/json',
}
@Component({ selector: 'editable'})
@View({template, styles: [styles], directives: [ROUTER_DIRECTIVES, NgFor, NgClass]})
export class Editable {
@Input() text = String(); // what we display;
@Input() uri = String();
@Input() key = String(); // key to send to the server, ex: "sla", "notes"
@Input() placeholder = String();
isEditing = false;
initVal = '';
constructor() {}
open(e){
e.preventDefault();
this.initVal = this.text;
this.isEditing = !this.isEditing;
}
async save(e){
e.preventDefault();
let body = {
[this.key]: this.text,
};
body = JSON.stringify(body);
const response = await fetch(`${this.uri}`, { method: 'PATCH', headers, body });
if(response.status !== 200){
alerts.error();
}
let data = await response.json();
alerts.success();
this.isEditing = !this.isEditing;
}
cancel(e){
e.preventDefault();
this.isEditing = !this.isEditing;
this.text = this.initVal;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment