Angular通过另一个组件获得新范围

Question

我正在构建一个基于组件的应用项目,角度为1.5.5

我正在使用d3js创建一些,.floating-node并为每个我创建一个新的$ scope并附加在已编译的组件中.

这部分代码如下:

    nodeEnter.each(() => {
        let childScope = this.$scope.$new();
        childScope.test = "test";
        let compiled = this.$compile('<mycomponent></mycomponent>')(childScope);
        (this.mainContainer).append(compiled);
    });

这部分代码完美无缺.

这是 mycomponent

export default class Mycomponent {
    constructor($scope) {
        console.log($scope.test);         // undefined
        console.log($scope.$parent.test); // test
    }
}
Mycomponent.$inject = ["$scope"];

但当我进入我的mycomponent组件.我无法做到正确$scope.

我查了一下$id,明白它childScope.$id是在Mycomponent $scope.$id += 1

我知道我可以通过$scope.$parent但是我会创造出不受欢迎的东西$scope,并且它在循环中并没有真正受到重视.

那么我怎么能得到相同的$scope？

Answer 1

您不需要$scope.$new()在您的情况下使用，因为$compile已经创建了一个新的范围实例。

解决您的问题的更简单的方法是使用 querySelector，我想执行类似以下代码的操作应该对您有所帮助：

newScope = angular.element(document.querySelector("#myId")).isolateScope();

这样您现在应该能够通过 newScope 传递数据。