0

I use angular-ui.bootstrap.typeahead and I want to update it's model when a promise resolves.

I use the typeahead-on-select attribute like this

typeahead-on-select="select($item,$model))"

In select($item,$model) some asynchronous stuff is going on, and when a promise resolves I want to set the value of the model based on the result.

promise.then(function (result) {
    $model.name = result;
    console.log($model);  // <-- $model IS updated but the view doesn't react on it
}

I have tried using $apply different places, but it doesn't seem to work (errors).

How do I get the view to notice I have updated the model?

8
  • First of all, what angular and ui.bootstrap version are you using? I faced the same problem few weeks ago and found a solution! Commented Nov 27, 2014 at 4:24
  • ui.bootstrap 0.12.0 @user2992420 Commented Nov 27, 2014 at 8:05
  • I think I've found the problem. I thought the $model in typeahead-on-select($item, $model, $label) was the typeahead model. But it's probably the model for the specific item in the list. Updating this model was not what I was trying to do. Now I send the name of the model variable to the function and update the model like this $scope[modelName] = result. Probably not the best solution, but it's working - I can move on :) Commented Nov 27, 2014 at 10:59
  • Can you try to use $parent.modelName instead of modelName in your ng-model attribute? There is a bug which can be solved by this. Commented Nov 27, 2014 at 12:12
  • It will point to wrong scope if I do that. What bug are you referring to? Do you have a link? Commented Nov 27, 2014 at 14:57

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.