Javascript Can'；t在动态$route AngularUI模式中访问$scope

我有一个AngularJS测试应用程序，它基于链接路径，使用AngularUI动态加载一个模式窗口。我的模态窗口已加载，但模板无法访问模态控制器中的$scope变量，并且我无法从模板触发任何$scope函数

这是$routeProvider：

.config(function($routeProvider) {
  $routeProvider
    .when('/page/:name', {
        templateUrl : 'modalContainer',
        controller : 'ModalCtrl'
    })
 })

这是控制器：

.controller('ModalCtrl',['$scope', '$modal', '$route', function($scope, $modal, $route) {

    console.log("hello I am the ModalCtrl") //This console log runs

    var modalInstance = $modal.open({
        templateUrl : 'modal.html',
    });

    $scope.activity = $route.current.pathParams.name;
    console.log($scope.activity) //This console log runs & shows the correct value,
                                 // but the $scope variable is not visible in the template

    //Modal controls
    $scope.close = function () {
        console.log("close!") //This does not run.
        modalInstance.close();
    };

}]);

---

我猜我不正确地创建了模态窗口的作用域，有人能看到问题吗？

您需要为模态窗口创建一个控制器，以便它可以访问$scope，因此代码如下所示：

var modalInstance = $modal.open({
    templateUrl : 'modal.html',
    controller: 'ModalCtrl'
});

var ModalCtrl = function ($scope, $modalInstance) {
    //Modal controls
    $scope.close = function () {
      console.log("close!") //This will now run
      modalInstance.close();
    };
}

---

打开模式时需要传递

范围

，如下所示

var modalInstance = $modal.open({
    templateUrl : 'modal.html',
    scope : $scope
});

如果您没有通过

范围

模式窗口，请使用

$rootScope.new（）

您还需要从模板中删除

ng controller

属性

<script type="text/ng-template" id="modalContainer">
    <div></div>
</script>