Nee*_*eel 6 controller modal-dialog angularjs angularjs-ng-repeat angular-ui-bootstrap
我有一个ng-repeat,我试图添加一个模式,将相同的范围变量传递给模态窗口.我能够打开模态窗口但是ng-repeat的范围值没有显示在模态中.希望我的代码解释得更好.这是我到目前为止:
<div ng-controller="CustomerController">
<div ng-repeat="customer in customers">
<button class="btn btn-default" ng-click="open()">{{ customer.name }}</button>
<!--MODAL WINDOW-->
<script type="text/ng-template" id="myModalContent.html">
<div class="modal-header">
<h3>The Customer Name is: {{ customer.name }}</h3>
</div>
<div class="modal-body">
This is where the Customer Details Goes<br />
{{ customer.details }}
</div>
<div class="modal-footer">
</div>
</script>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
控制器:
app.controller('CustomerController', function($scope, $timeout, $modal, $log, customerServices) {
$scope.customers= customerServices.getCustomers();
// MODAL WINDOW
$scope.open = function () {
var modalInstance = $modal.open({
templateUrl: 'myModalContent.html',
});
};
});
Run Code Online (Sandbox Code Playgroud)
以上打开模态窗口.但是,来自ng-repeat的客户详细信息(例如{{customer.name}})不会传递到模态窗口.控制器出了什么问题?
我在这里查看Angular Bootrap UI示例后尝试创建它:http://angular-ui.github.io/bootstrap/
编辑:
这是一个jsfiddle示例: http ://jsfiddle.net/Alien_time/8s9ss/3/
syl*_*ter 12
我也更新了你的小提琴和下面的代码.我希望这会有所帮助.
问候
var app = angular.module('app', ['ui.bootstrap']);
app.controller('ModalInstanceCtrl', function ($scope, $modalInstance, customer)
{
$scope.customer = customer;
});
app.controller('CustomerController', function($scope, $timeout, $modal, $log) {
$scope.customers = [
{
name: 'Ricky',
details: 'Some Details for Ricky',
},
{
name: 'Dicky',
details: 'Some Dicky Details',
},
{
name: 'Nicky',
details: 'Some Nicky Details',
}
];
// MODAL WINDOW
$scope.open = function (_customer) {
var modalInstance = $modal.open({
controller: "ModalInstanceCtrl",
templateUrl: 'myModalContent.html',
resolve: {
customer: function()
{
return _customer;
}
}
});
};
});
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
14319 次 |
| 最近记录: |