Angular通过另一个组件获得新的作用域

Angular get new scope through another component

本文关键字:作用域 组件 另一个 Angular      更新时间:2023-09-26

我正在用angular 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.$idMycomponent $scope.$id += 1

我知道我可以通过$scope.$parent,但我将创建不需要的$scope,并且它在循环中并不真正受欢迎。

那么我怎样才能得到相同的$scope呢?

似乎有一个误解。.component将始终创建它自己的、孤立的作用域,并且您根本不需要在组件中使用$scope。如果你认为这在你的情况下是绝对必要的,那么使用.directive。但我建议适当地重新设计您的组件。

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

更简单的方法来解决你的问题是使用querySelector,我想做一些像下面的代码应该帮助你:

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

这样你就可以通过newScope传递数据了