无法在动态$路径中访问$ scope AngularUI模态

我有一个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(); 
    }; 

}]);

我想，我创造了模态窗口的范围不正确不知何故，有人可以看到问题？

来源

2014-09-19 Ila

您需要为模态窗口创建一个控制器，以便它可以访问$范围，所以代码应该是这样的：

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(); 
    }; 
}

来源

2014-09-19 18:25:12 V31

你需要通过scope时开放模式，这样

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

，如果你不及格scope模态窗口中使用$rootScope.new()

还需要删除ng-controller ATT ribute from template

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

来源

2014-09-19 20:01:37 Grundy

无法在动态$路径中访问$ scope AngularUI模态

回答

相关问题