Модальность angular-ui-bootstrap не возвращает результат

У меня возникла проблема с модальным сервисом из Angular-ui-bootstrap. Я настроил модальное окно в соответствии с примером: http://angular-ui.github.io/bootstrap/, но я не могу получить результат из модального окна, если я удалю элементы списка из модального содержимого и заменю их текстовой областью и другой ng-моделью. Я бы установил jsfiddle, но я не знаю, как включить определенные библиотеки (например, angular-ui-bootstrap), которые необходимы, чтобы показать, что я хочу. У меня есть скриншот моего модального окна: http://d.pr/i/wT7G.

Ниже приведен код моего основного контроллера, основного представления, модального контроллера и модального представления:

код основного вида

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

главный контроллер

$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());
    });
};

модальный вид

<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>

модальный контроллер

'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');
        };

    });

person Michael Trouw    schedule 11.02.2014    source источник


Ответы (1)


Что показывает console.log() внутри $scope.ok? Если он действительно показывает правильное значение, я бы предложил обернуть ваши данные расписания внутри объекта, чтобы избежать каких-либо проблем, связанных с областью действия:

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

Затем внутри вашего модального представления:

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

И ваш вывод:

$modalInstance.close($scope.schedule.data);
person Matt Way    schedule 11.02.2014
comment
console.log() внутри функции $scope.ok() не показал результата, по крайней мере, не виден в консоли. ваш способ работает, хотя я не понимаю, почему это так? Почему не работает передача данных без инкапсуляции данных внутри литерала объекта? это что-то специфичное для angular js, что я пропустил? - person Michael Trouw; 11.02.2014
comment
Я всегда обнаруживаю, что ссылаюсь на блог этого парня: jimhoskins.com/ 14.12.2012/вложенные-области-в-angularjs.html - person Matt Way; 11.02.2014
comment
Спасибо, это многое прояснило! - person Michael Trouw; 11.02.2014
comment
Спасибо, это сделало это и для меня. - person Dayan; 08.01.2016