Scope issue in AngularJS using AngularUI Bootstrap Modal

Question

plunker: http://plnkr.co/edit/wURNg8ByPYbEuQSL4xwg

example.js:

angular.module(\'plunker\', [\'ui.bootstrap\']);
  var ModalDemoCtrl          


        

Answer 1

Update Nov 2014: the issue is fixed with angular-ui-bootstrap 0.12.0 - the transclusion scope is merged with the controller's scope. There is no need to do anything. Just stay with:

Before 0.12.0:

Angular-UI modals are using transclusion to attach modal content, which means any new scope entries made within modal are created in child scope.

You should use inheritance and initialize empty text entry in parent $scope or you can explicitly attach the input to parent scope: