为什么当我尝试打开离子模板模式时，$ scope.modal未定义？

Question

我正在研究用于iPad的Ionic-app。 在我的模板之一，我有一个项目的树视图。 当我点击项目我想打开其他模板模态。 我用我的一个模板试过了，但是我得到一个错误，控制器中的$ scope.modal未定义。

此外，加载的模板可以使用它自己的控制器吗？

这是我的控制器代码：

.controller('SystemValidateCtrl', function ($scope, $state, $stateParams, $ionicModal, ComponentTree, TypeOfTests, TypeOfTestReasons) { 
    $scope.showTypeOfTest = function() { 
     $ionicModal.fromTemplateUrl('templates/type-of-test.html', { 
      scope: $scope, 
      animation: 'slide-in-up' 
     }).then(function (modal) { 
      $scope.modal = modal; 
     }); 
    }; 
    $scope.openModal = function() { 
     $scope.modal.show(); 
    }; 
    $scope.closeModal = function() { 
     $scope.modal.hide(); 
    }; 
    //Cleanup the modal when we're done with it! 
    $scope.$on('$destroy', function() { 
     $scope.modal.remove(); 
    }); 
    // Execute action on hide modal 
    $scope.$on('modal.hidden', function() { 
     // Execute action 
    }); 
    // Execute action on remove modal 
    $scope.$on('modal.removed', function() { 
     // Execute action 
    }); 

    $scope.$on('$ionTreeList:ItemClicked', function (event, item) { 
     //TODO: Show the template according to the item.id 
     var panel_dynamic = document.getElementById('panel_dynamic_to_treeitem'); 
     if (panel_dynamic.hasChildNodes()) { 
      panel_dynamic.removeChild(panel_dynamic.childNodes[0]); 
     } 
     var line = document.createElement("div"); 

     if(item.id == 9999) //Anzeige der Testarten 
     { 
      $scope.showTypeOfTest(); 
      $scope.openModal(); 
     } 
    }) 
}) 

Answer 1

由于fromTemplateUrl返回一个承诺，因为模式没有定义由于$scope.modal = modal;当时尚未被称作

$scope.showTypeOfTest(); 
$scope.openModal(); 

将无法​​正常工作。

建议：重构为链接承诺：

showTypeOfTest = function() { 
return $ionicModal.fromTemplateUrl('templates/type-of-test.html', { 
      scope: $scope, 
      animation: 'slide-in-up' 
     }).then(function (modal) { 
      $scope.modal = modal; 
     }); 
} 

那么你可以使用

$scope.showTypeOfTest().then($scope.openModal);