Cannot get ng-messages working

Please check the following codepen and let me know if you can resolve what is wrong.

This is based off the trivial angular example docs for ng-messages, docs:

I added ng-messages.js from cdn. There are a few issues:

  1. No validation seems to be happening which triggers ng-messages to display any errors. Instead it shows all errors all the time, which is not the expected behavior (see plnkr linked above for desired behavior)
  2. The <pre> tag is there to dump the contents of angular’s form object which contains all the internal state for form validation – although on codepen, it seems to jumble the rendering, at least in Chrome – YMMV – I’m more interested in solving #1

You need to add it as a dependency. In the first line:

angular.module('ionicApp', ['ionic', 'ngMessages'])