title: AngularJS: Update model passed to directive
body: <p>I'm trying to make a directive that inserts elements after an input (which is tagged with the directive) but also updates the input from the inserted elements.</p>
  
  <pre><code>angular.module('afterDir', [])
  .directive('after', function ($compile) {
  
      return {
          require: 'ngModel',
          link: function (scope, element, attrs, ngModel) {
  
              scope.clickHandler = function (index) {
  
                  console.log(index);
                  ngModel.$setViewValue("something");
  
              }
  
              var content = angular.element('&lt;ul&gt;&lt;li ng-click="clickHandler()"&gt;after&lt;/li&gt;&lt;li ng-click="clickHandler()"&gt;after too&lt;/li&gt;&lt;/ul&gt;');
              content.insertAfter(element);
              $compile(content)(scope);
  
          }
      }
  });
  </code></pre>
  
  <p>The click handler fires but the model does not update, is there something else I need to call to update the model? Thanks!</p>