title: AngularJs directive: value from cookie does not apply to data binding
body: <p>I have created the directive, with the dropdown list of organizations the user is assigned to:</p>
  
  <pre><code>.directive('orgList', ['$rootScope', '$state', 'Auth', 'ipCookie', function ($rootScope, $state, Auth, ipCookie) {
      return {
          restrict: 'A',
          replace: true,
          template: '&lt;div class="form-group"&gt;&lt;div class="input-group"&gt;'+ 
              '&lt;span class="input-group-addon"&gt;&lt;b&gt;My orgs&lt;/b&gt;&lt;/span&gt;'+
               '&lt;select class="form-control" ng-model="selectedOrg"'+
                    'ng-options="org.name for org in orgs"&gt;&lt;/select&gt;'+
                  '&lt;/div&gt;&lt;/div&gt;',
          link: function(scope, elem, attrs) {
                  scope.orgs = Auth.user.organizations;
                  scope.selectedOrg = ipCookie('selectedOrg') || _.first(scope.orgs);
  
                  scope.$watch('selectedOrg', function (value) {
                      if(!_(value).isEmpty()) {
                          ipCookie('selectedOrg', value);
  
                          var temp = { 
                              role: Auth.userRoles[value.role] || Auth.user.role 
                          }
                          _(Auth.user).extend(temp);
                          $rootScope.$broadcast('userRoleChanged', value.id);
                      }
                  });
  
                  scope.$on('userRoleChanged', function (event, id) {
                      if(!Auth.authorize(Auth.accessLevels.admin)) {
                          if($state.current.url.match('/organization/')) {
                              $state.go('private.profile');
                          }
                      } 
                  });
              }
          }
      }
  }])
  </code></pre>
  
  <p>Now I want to make it remember the user selection: when user choose the organization in dropdown, after page reload I want him see the same organization from cookie.</p>
  
  <p>What is the problem:</p>
  
  <pre><code>scope.selectedOrg = ipCookie('selectedOrg') || _.first(scope.orgs);
  </code></pre>
  
  <p>if the cookie is not defined and the <code>_.first(scope.orgs)</code> part is selected, the dropdown show the organization as it should, but if I get the value from cookie, then it show empty dropdown text. <code>console.log()</code> show the selectedOrg to be correct in both cases. </p>