2016-02-04 368 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裏面這些項目用於生成模態窗口中顯示的鏈接。

玩一點值,觀察結果。

相關問題