angular-ui-bootstrap modal not passing back结果

我遇到了来自Angular-ui-bootstrap的模态服务的问题。我已经根据下面的示例设置了模态：http://angular-ui.github.io/bootstrap/但是如果我从模态内容中删除列表项并将其替换为文本区域和不同的ng模型，我无法从模态中获得结果。我会设置一个jsfiddle，但我不知道如何包含必要的特定库（如angular-ui-bootstrap）以显示我想要的内容。我有我的模式截图：http://d.pr/i/wT7G。angular-ui-bootstrap modal not passing back结果

下面是从我的主控制器的代码，主视图，模态控制器和模态的视图：

主视图代码

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

    });

来源

2014-02-11 Michael Trouw

什么的console.log()内$scope.ok说明了什么？如果它确实显示正确的值，我建议包装对象内的调度数据，以避免任何范围的相关问题：

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

你的模式视图内

然后：

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

和你的输出：

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

来源

2014-02-11 01:44:50

$ scope.ok（）函数内的console.log（）显示没有结果，至少在控制台中不可见。尽管我不明白它为什么会起作用，但你的方式有效吗？为什么不传递数据而没有在对象文字中封装数据呢？我错过了什么角度js具体？ –

我总是发现自己链接到这家伙博客：http://jimhoskins.com/2012/12/14/nested-scopes-in-angularjs.html –

谢谢，这澄清了很多！ –

angular-ui-bootstrap modal not passing back结果

回答

相关问题