title: AngularJS custom directive: how to update parent variable specified in ng-model?
body: <p>I'm trying to create a simple directive but its not going well. My directive is a div that has a datepicker. The directive is used by typing pickmoment as an attribute:</p>
  
  <pre><code>&lt;p&gt;Publish: &lt;b&gt;{{publishedTime}}&lt;/b&gt;&lt;/p&gt;
  &lt;div ng-model="publishedTime" pickmoment&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>As you can see I'm trying to update publishedTime from inside the directive. It does not work. The directive is defined as follows:</p>
  
  <pre><code>app.directive('pickmoment', function() {
      return {
          restrict: 'A',
          scope: true,
  
          template: '
                  &lt;input class="datepicker" id="_pickmoment" value="now" type="text"&gt;\
                  &lt;br&gt;&lt;br&gt;\
                  &lt;button type="button" class="okbutton"&gt;Ok&lt;/button&gt;\
                  &lt;button type="button"&gt;Cancel&lt;/button&gt;',
  
          link: function (scope, element, attr) {
                  $(element).find('.datepicker').datepicker( { format: "MM d, yyyy", autoclose:true } );
                  scope.$parent[attr.ngModel] = 'default value';
  
                  $(element).find('.okbutton').click(function () {
  
                      var helpDate = $('#_pickmoment').val();
                      scope.$parent[attr.ngModel] = helpDate;
  
                  });
          },
  
      };
    });
  </code></pre>
  
  <p>"Default value" for ng-model variable is set correctly but any update when click the Ok button does not do anything.</p>
  
  <p>Can you help me? Thanks!</p>