olenderhub · July 18, 2017 12:03
diff --git a/components.my-component.js b/components.my-component.js
 import Ember from 'ember';
 import MyModelValidations from 'app/validations/my-model';
 import lookupValidator from 'ember-changeset-validations';
 import Changeset from 'ember-changeset';

 const { get, inject, set } = Ember;

 export default Ember.Component.extend({
  store: inject.service(),
  actions: {
    update(object, propertyName, value) {
      console.log(get(object, 'errors'));
      set(object, propertyName, value);
      console.log(get(object, 'errors'));
    },

    register(changeset) {
      debugger
      changeset.validate().then(() => {
        debugger
        changeset
        return true
      });
    }
  },
  init() {
    this._super(...arguments);
    let model = get(this, 'store').createRecord('my-model');
    const changeset = new Changeset(model, lookupValidator(MyModelValidations), MyModelValidations);
    set(this, 'changeset', changeset);
  },  
 });
diff --git a/controllers.application.js b/controllers.application.js
 import Ember from 'ember';

 export default Ember.Controller.extend({
  appName: 'Ember Twiddle'
 });
diff --git a/models.my-model.js b/models.my-model.js
 import Model from "ember-data/model";
 import attr from "ember-data/attr";
 import { belongsTo, hasMany } from "ember-data/relationships";

 export default Model.extend({
  firstName: attr('string'),
  lastName: attr('string')
 });
diff --git a/templates.application.hbs b/templates.application.hbs
 <h1>Welcome to {{appName}}</h1>
 <br>
 <br>
 {{my-component}}

 {{outlet}}
 <br>
 <br>
diff --git a/templates.components.my-component.hbs b/templates.components.my-component.hbs
 {{#form-for changeset class="form-horizontal" as |f|}}
  <h3 class="text-center">Register</h3>
  {{f.text-field "firstName"
    required=true
    update=(action "update")}}

  {{f.text-field "lastName"
    update=(action "update")}}
    
  {{f.submit class="btn btn-primary" text="Save" action=(action "register" changeset)}}
 {{/form-for}}

 {{#each changeset.errors as |error|}}
 {{error.validation}}
 {{/each}}
diff --git a/twiddle.json b/twiddle.json
 {
  "version": "0.12.1",
  "EmberENV": {
    "FEATURES": {}
  },
  "options": {
    "use_pods": false,
    "enable-testing": false
  },
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "2.12.0",
    "ember-template-compiler": "2.12.0",
    "ember-testing": "2.12.0"
   
  },
  "addons": {
    "ember-data": "2.12.1",
    "ember-changeset": "1.2.1",
    "ember-changeset-validations": "1.2.4",
    "ember-form-for": "2.0.0-alpha.15",
    "ember-i18n": "5.0.2"
  }
 }
diff --git a/validations.my-model.js b/validations.my-model.js
 import { validatePresence, validateNumber } from 'ember-changeset-validations/validators';
 import validateCustom from '../validators/custom';

 export default {
  firstName: [
    validatePresence({ presence: true }),
    validateCustom()
  ],
  lastName: [
    validatePresence({ presence: true })
  ]
 }
diff --git a/validators.custom.js b/validators.custom.js
 export default function validateCustom({ min, max } = {}) {
  return (key, newValue, oldValue, changes, content) => {
    // validation logic
    return 'error'
    // return `true` if valid || error message string if invalid
  }
 }
	import Ember from 'ember';
	import MyModelValidations from 'app/validations/my-model';
	import lookupValidator from 'ember-changeset-validations';
	import Changeset from 'ember-changeset';

	const { get, inject, set } = Ember;

	export default Ember.Component.extend({
	store: inject.service(),
	actions: {
	update(object, propertyName, value) {
	console.log(get(object, 'errors'));
	set(object, propertyName, value);
	console.log(get(object, 'errors'));
	},

	register(changeset) {
	debugger
	changeset.validate().then(() => {
	debugger
	changeset
	return true
	});
	}
	},
	init() {
	this._super(...arguments);
	let model = get(this, 'store').createRecord('my-model');
	const changeset = new Changeset(model, lookupValidator(MyModelValidations), MyModelValidations);
	set(this, 'changeset', changeset);
	},
	});
	import Ember from 'ember';

	export default Ember.Controller.extend({
	appName: 'Ember Twiddle'
	});
	import Model from "ember-data/model";
	import attr from "ember-data/attr";
	import { belongsTo, hasMany } from "ember-data/relationships";

	export default Model.extend({
	firstName: attr('string'),
	lastName: attr('string')
	});
	<h1>Welcome to {{appName}}</h1>
	<br>
	<br>
	{{my-component}}

	{{outlet}}
	<br>
	<br>
	{{#form-for changeset class="form-horizontal" as \|f\|}}
	<h3 class="text-center">Register</h3>
	{{f.text-field "firstName"
	required=true
	update=(action "update")}}

	{{f.text-field "lastName"
	update=(action "update")}}

	{{f.submit class="btn btn-primary" text="Save" action=(action "register" changeset)}}
	{{/form-for}}

	{{#each changeset.errors as \|error\|}}
	{{error.validation}}
	{{/each}}
	{
	"version": "0.12.1",
	"EmberENV": {
	"FEATURES": {}
	},
	"options": {
	"use_pods": false,
	"enable-testing": false
	},
	"dependencies": {
	"jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
	"ember": "2.12.0",
	"ember-template-compiler": "2.12.0",
	"ember-testing": "2.12.0"

	},
	"addons": {
	"ember-data": "2.12.1",
	"ember-changeset": "1.2.1",
	"ember-changeset-validations": "1.2.4",
	"ember-form-for": "2.0.0-alpha.15",
	"ember-i18n": "5.0.2"
	}
	}
	import { validatePresence, validateNumber } from 'ember-changeset-validations/validators';
	import validateCustom from '../validators/custom';

	export default {
	firstName: [
	validatePresence({ presence: true }),
	validateCustom()
	],
	lastName: [
	validatePresence({ presence: true })
	]
	}
	export default function validateCustom({ min, max } = {}) {
	return (key, newValue, oldValue, changes, content) => {
	// validation logic
	return 'error'
	// return `true` if valid \|\| error message string if invalid
	}
	}