angularjs - ng-switch does not bind ng-model

Question

I have this repro http://embed.plnkr.co/nVCmukG5abpi1Y4ZHkrq that show when I click \'Title3\' and enter a value in text box although the entered value shows reflected in th

Answer 1

This is because you're actually creating a child scope inside of the ng-switch. So another test property exists on a scope belonging to the ngSwitch directive. It will initially show the value from it's parent scope, but when you edit it, because it is a primitive, it only edits the value on the child, not the parent. Prototypical inheritance does not come into play here (but that's what we need).

When you click the button the button is alerting/console.logging the property on the parent scope... which the child cannot change.

To fix this use $parent.test on your ng-model attribute in your ngSwitch:

a snippet:

  
  {{test}}

And here's a fork of your plunker showing it in action.