Mic*_*ouw 8 modal-dialog twitter-bootstrap angularjs 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>
Run Code Online (Sandbox Code Playgroud)
主控制器
$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());
});
};
Run Code Online (Sandbox Code Playgroud)
模态视图
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</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>
Run Code Online (Sandbox Code Playgroud)
模态控制器
'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');
};
});
Run Code Online (Sandbox Code Playgroud)
Mat*_*Way 13
console.log()里面有什么$scope.ok表现?如果确实显示了正确的值,我建议将您的计划数据包装在对象中,以避免任何与范围相关的问题:
$scope.schedule = { data: '' };
Run Code Online (Sandbox Code Playgroud)
然后在你的模态视图中:
<textarea class="form-control" rows="15" ng-model="schedule.data"></textarea>
Run Code Online (Sandbox Code Playgroud)
而你的输出:
$modalInstance.close($scope.schedule.data);
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
29388 次 |
| 最近记录: |