Mithril: Background AJAX Loading Indicator

ajax_loading_indicator.js

var LoadingExample = {
  controller: function () {
    var ctrl = this
    // `background: true` is important here.
    // Otherwise Mithril will wait for the AJAX request to complete before rendering the view.
    ctrl.users = m.request({ url: 'users', method: 'GET', background: true })
  },
  view: function (ctrl) {
    return m('.users', [
      m('h3', "All Users"),
      usersView(ctrl), // Helper method to keep your view clean
      m('p', "etc. etc.")
    ])
  }
}

function usersView (ctrl) {
  // If ctrl.users() is empty, then the m.request has not completed yet.
  if (! ctrl.users()) {
    // This could be an animated ajax loader
    return m('p', "Loading...")
  }
  return ctrl.users().map(function(user) {
    return m('.user', user.name)
  })
}