Only show validation errors after user has interacted with element

[mike1o1]

Currently, {{paper-input}} is in violation of Material Design specification which states that an application should 'show error text only after user interaction with a field'. Right now, the paper input component shows error messages before the user has interacted with it. This can be fixed by adding an isTouched property which gets set on focusOut, and then only displaying error messages if isTouched is true.

[emirotin]

I have a related question: is it possible to reset the input to "untouched" state?

I have a fairly standard functionality — a list of records + a new record form. When the form is submitted I create a new record, refresh the list and bind the form to the new fresh record.
Here's my code:

    addObject() {
      this.get('model.newObject').save().then(() => {
        this.set('model.objects', this.store.query('object', {}))
        this.set('model.newObject', this.store.createRecord('object'))
      })
    }

So the input stays the same, but now it's bound to the new model record, which has a required field initially set to an empty string. It makes it instantly highlighted as having an error because it was already touched before.