2016-02-04 184 views
1

我正在学习angular ui bootstrap模态窗体,并在plunker中发现了一些示例。Angular UI Bootstrap Modal Popup

angular.module('plunker', ['ui.bootstrap']); 
var ModalDemoCtrl = function ($scope, $modal, $log) { 

    $scope.items = ['item1', 'item2', 'item3']; 

    $scope.open = function() { 

    var modalInstance = $modal.open({ 
     templateUrl: 'myModalContent.html', 
     controller: ModalInstanceCtrl, 
     resolve: { 
     items: function() { 
      return $scope.items; 
     } 
     } 
    }); 

    modalInstance.result.then(function (selectedItem) { 
     $scope.selected = selectedItem; 
    }, function() { 
     $log.info('Modal dismissed at: ' + new Date()); 
    }); 
    }; 
}; 

var ModalInstanceCtrl = function ($scope, $modalInstance, items) { 

    $scope.items = items; 
    $scope.selected = { 
    item: $scope.items[0] 
    }; 

    $scope.ok = function() { 
    $modalInstance.close($scope.selected.item); 
    }; 

    $scope.cancel = function() { 
    $modalInstance.dismiss('cancel'); 
    }; 
}; 

这是plunker链接http://plnkr.co/edit/ggtsdMSyYIRcXHe9zkw1?p=preview

的问题是:

什么用这条线

$scope.items = ['item1', 'item2', 'item3'];

为什么有一个数组那里?

如何让它更简单?

回答

1

这些项目中

$modal.open({ 
    templateUrl: 'myModalContent.html', 
    controller: ModalInstanceCtrl, 
    resolve: { 
    items: function() { 
     return $scope.items; 
    } 
    } 
}); 

这些项目注入ModalInstanceCtrlitems参数传递给ModalInstanceCtrlresolve关键。

ModalInstanceCtrl里面这些项目用于生成模态窗口中显示的链接。

玩一点值,观察结果。

相关问题