javascript - AngularJs - ajax 呼び出し後に ng-options がバインドされない

Question

ajax 呼び出し後に ng-options の選択されたインデックスを変更しようとしましたが、変更されません。

//Html Section...

<select id="fooId" ng-model ="foo.formula"
   ng-options="formulas as name for (formulas, name) in the_formula"></select>

//End Html Section...


//js file...

//get list of formula from server...
TheSource.Get.then(function(response){
    $scope.the_formula = response.the_formula;
});


//do something awesome, then..
//binding data from server...

TheData.Get.then(function(response){
    //binding the data to view...
    //all of the element is binding, except the ng-options part..
    $scope.foo = response; 

    //not working..
    //$scope.formula = response.formulaId //it is return integer ID like (1, 2, 3, etc..)
});

// End js file...

そして、これがMy APIで送信するデータです。

{ 
   "the_formula":{
     "123":"formula1",
     "124":"formula2"
   }
}

どうしたの？ng-options の選択を自動的に変更するには?