We have to use the we make changes, we still need an initial call to build the initial state of our component. You don’t need to have a wild imagination to see this would look like a mess on more complicated test scenarios, if we had to chain every exception after a promise.
This site and all of its contents are referring to Angular JS (version 1.x), if you are looking for the latest Angular, please visit
When the filtering elements were changed, a remote service call was made in the filtering view, and the results needed to modify the data view.
However, I discovered that when the results came back from the service call, the view was not updating with the new data. There are a few things at play here and I'm going to start with some simple examples of binding, then expand to discuss $watch(), and finally I'll talk about how to use $apply() to solve the problem.
(This behaviour can be changed with .)What we want to see, is the new value we put in the input field, not the initial one.
The issue is that even though we updated the value property, that doesn’t trigger Ng Model’s binding by itself.
Unfortunately, Angular 2 is a much more delicate and complex environment than Angular 1, so are the testing tools.
This is a case study of testing a simple component with two-way binding, highlighting the pitfalls to avoid. Now at least we have the initial value going through.
The reason is that Test Bed doesn’t run the change detector at all, unless asked to — so by default, not even the initial bindings are executed.
Googling around for updated solutions didn’t yield much so I mashed together a nice solution using some code from this Stack Overflow question.
All resulted in this – a debounce/delay/throttled model update script for Angular JS 1.2 .