javascript - Issue setting ng-grid data with drop down default -

here simplified version of have. have 2 tables: foodtype , food. foodtype has beverages , deserts in it. columns id , name. food has coke, sprite, root beer, pie, cake , ice cream. columns in table id, name , foodtypeid (fk).

on page have drop down foodtype , grid food. when user selects foodtype associated food displayed in ng-grid. works.

the user logs in , has default food type id associated user name. when page loads though, default food type displays in drop down food displays in grid. , can't see why. can see?

<select ng-model="vm.selectedfoodtype"                         ng-options="foodtype.id foodtype.name foodtype in vm.foodtype"                         ng-change="vm.foodgridoptions.filteroptions.filtertext = vm.selectedfoodtype ? 'foodtypeid:' + vm.selectedfoodtype : ''"                         class="form-control">                     <option value="">- select food type -</option>                 </select> 

function getfood() {         return datacontext.getfood()             .then(function (response) {                 return vm.food = response.data;             })             .catch(function (exception) {                 logerror('call food failed.' + exception.data.exceptionmessage, null, true)             });     }   function getfoodtype() {         return datacontext.getfoodtype()             .then(function (response) { return vm.foodtype = response.data; })             .catch(function (exception) { logerror('call food type  failed: ' + exception.data.exceptionmessage, null, true) });     }   vm.foodgridoptions = {         data: 'vm.food',         enablerowselection: true,         multiselect: false,         columndefs: [             { field: 'foodtypeid', displayname: 'foodtypeid', visible: false },             { field: 'name', displayname: 'food', minwidth: 250, width: 'auto', resizable: true },          ],         filteroptions: { filtertext: vm.selectedfoodtype, useexternalfilter: false },         sortinfo: { fields: ['vm.food.name'], directions: ['asc'] },         afterselectionchange: function (rowitem) {             if (!rowitem.selected)                 return;              vm.importlog = rowitem.entity;             vm.appydisabled = false;          }     };  function getdefaultfoodtype() {         return datacontext.getuser(user.username)             .then(function (response) {                 vm.selectedfoodtype = response.data.defaultfoodtypeid;             });     }