Growing collection of utilities for ng-model

example.html.erb

<%= form_for @model do |form| %>
  <div class="form-group">
    <%= form.text_field :title, class: "form-control", placeholder: "Title", "ng-model" => "title", "init-model" => true %>
  </div>

  <div class="form-group">
    <%= form.text_field :slug, class: "form-control", placeholder: "slug", "ng-model" => "slug", "init-model" => true %>
  </div>

  <div class="form-group">
    <%= form.hidden_field :fields_data, "ng-model" => "fields_data", "json-model" => true, "init-model" => true, "hidden-model" => true %>
    <div my-fancy-editor="fields_data"></div>
  </div>

  <div class="form-actions">
    <%= form.submit class: "btn btn-primary" %>
  </div>
<% end %>

gistfile1.coffee

admin.directive "jsonModel", ->
  require: "ngModel"
  link: (scope, element, attr, ctrl) ->
    ctrl.$parsers.push (json) -> JSON.parse(json)
    ctrl.$formatters.push (data) -> JSON.stringify(data)

admin.directive "initModel", ->
  require: "ngModel"
  link: (scope, element, attrs, ctrl) ->
    ctrl.$setViewValue(element.val())

admin.directive "hiddenModel", ->
  require: "ngModel"
  link: (scope, element, attrs, ctrl) ->
    ctrl.$render = ->
      element.val(if ctrl.$isEmpty(ctrl.$viewValue) then '' else ctrl.$viewValue)