Angular -ui-bootstrap modal does not pass the result

Question

I am having a problem with a modular service from Angular -ui-bootstrap. I installed the modal option according to the example: http://angular-ui.imtqy.com/bootstrap/ , but I cannot get the result from the modal if I remove the list of elements from the modal content and replace them with a text area and another ng- model. I would install jsfiddle, but I don’t know how to include certain libraries (e.g. Angular -ui-bootstrap) that are needed to show what I want. I have a screenshot of my modal: http://d.pr/i/wT7G .

Below is the code of my main controller, main view, modal controller and modal view:

main view code

<button type="button" class="btn btn-success" ng-click="importSchedule()">import schedule (JSON)</button> 

main controller

 $scope.importSchedule = function() { var modalInstance = $modal.open({ templateUrl: 'views/importmodal.html', controller: 'ModalInstanceCtrl' }); modalInstance.result.then(function (result) { console.log('result: ' + result); // $scope.schedule = angular.fromJson(scheduleJSON); }, function () { console.info('Modal dismissed at: ' + new Date()); }); }; 

modal view

 <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> <h4 class="modal-title">Import schedule(JSON)</h4> </div> <div class="modal-body"> <textarea class="form-control" rows="15" ng-model="schedule"></textarea> <pre>form = {{schedule | json}}</pre> </div> <div class="modal-footer"> <button class="btn btn-primary" ng-click="ok()">OK</button> <button class="btn btn-default" ng-click="cancel()">Cancel</button> </div> 

modal controller

 'use strict'; angular.module('VMP') .controller('ModalInstanceCtrl', function ($scope, $modalInstance) { $scope.schedule = ''; $scope.ok = function () { console.log('schedule: ', $scope.schedule); $modalInstance.close($scope.schedule); }; $scope.cancel = function () { $modalInstance.dismiss('cancel'); }; }); 

Answer 1

What does console.log() show inside $scope.ok ? If it really shows the correct value, I would suggest wrapping your schedule data inside an object to avoid any scaling issues:

 $scope.schedule = { data: '' }; 

Then inside your modal view:

 <textarea class="form-control" rows="15" ng-model="schedule.data"></textarea> 

And your conclusion:

 $modalInstance.close($scope.schedule.data);