title: Default values for an Angular.js directive element
body: <p>My problem is that I need to create a directive that takes it's elements from controllers scope or if its not defined in scope take it from DOM elements.<br>
  This is my directive:</p>
  
  <pre><code>rmsUtils.directive('rmsDateRange', ['$parse', function($parse) {
      return {
          restrict: 'A',
          require: 'ngModel',
          link: function(scope, element, attrs, controller) {
              var date = {
                  'start' : element.find('[rms-date-range-field=start]').val(),
                  'end' : element.find('[rms-date-range-field=end]').val(),
              };
              element.datepicker({
                  format: "yyyy",
                  startView: 1,
                  minViewMode: 2,
                  autoclose: true
              }).on('changeDate', function(e){
                  var year = e.date.getFullYear(),
                  id = e.target.getAttribute('rms-date-range-field');
                  date[id] = String(year);
                  scope.$apply(read);
              });
  
              function read() {
                  controller.$setViewValue(date);
              }
  
              read();
          }
      };
  }]);
  </code></pre>
  
  <p>Element looks like:</p>
  
  <pre><code>&lt;div class="input-group input-daterange input-group-sm" rms-date-range id="id_birth_date_range" name="birth_date_range" ng-model="filters.birth_date_range" ng-show="showCustomBirthYears()"&gt;
      &lt;input class="form-control input-xs" type="text" rms-date-range-field="start" value="1980"&gt;
      &lt;span class="input-group-addon"&gt;to&lt;/span&gt;
      &lt;input class="form-control input-xs" type="text" rms-date-range-field="end" value="1995"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And the controller is let's say a simple ctrl that defines <code>$scope.filters.birth_date_range = {start: 2000, end: 2010}</code>.</p>
  
  <p>The values are assigned correctly but when my directive gets initialized it's reassigning them to 1980, 1995. In the <code>link()</code> of my directive before calling the <code>read()</code> function <code>controller.$viewValue</code> and <code>controller.$modelValue</code> are <code>undefined</code>.</p>
  
  <p>Any help is very appreciated :)</p>