Question

我尝试通过QUnit框架测试我的angularjs应用程序在页面u_xt.append(list(u_new))上 - 我使用名为mysite.ru/#/unittest/的控制器。但在我的应用程序中，我有一个UnittestCtrl和其他我要测试的页面。问题是我无法从unittest页面访问DetailCtrl的范围。

这是我使用的代码，以便在DetailCtrl上获得Unittest控制器的范围。如何从mysite.ru/#/unittest/？

访问范围

DetailCtrl

我也试过了，但没有结果：

var appElement = document.querySelector('[ng-app=TheApp]');
var appScope = angular.element(appElement).scope();
var controllerScope = appScope.$$childHead;
console.log(controllerScope.link);

错误：var serviceLocator = angular.injector(["TheApp"]) scope = serviceLocator.get('$rootScope') var $controller = serviceLocator.get('$controller'); $controller('DetailCtrl', { $scope: scope });

我的DetailCtrl

Unknown provider: $rootElementProvider <- $rootElement <- $location <- $route

Answer 1

angular.injector创建一个注入器（未加载ng模块）。

angular.bootstrap调用angular.injector来创建注入器（ng模块已加载）并将其附加到某个DOM元素。它会创建$rootElement服务。

要在测试中匹配angular.bootstrap功能，应该模拟$rootElement：

angular.injector([
  'ng',
  ($provide) => {
    $provide.value('$rootElement', angular.element('<div>'))
  },
  'app'
]);

或者更好的是，使用angular-mock执行此操作以及更多内容。

angular.injector(['ngMock', 'app']);

它将自己绑定到Jasmine和Mocha并自动加载ngMock，但它不是QUnit的选项。

但是这里应该解决的实际问题是路由器。在单元测试中，单元应与其他单元隔离，其他单元（$route和$routeParams服务）应该被模拟。它可以在注入器或$controller中完成，它允许覆盖来自注入器的依赖关系：

var mockedRoute = { ... }.
var mockedRouteParams = { ... };

$controller('DetailCtrl', {
  $scope: scope,
  $route: mockedRoute,
  $routeParams: mockedRouteParams 
});

从angularjs中的某个控制器获取范围

1 个答案: