Question

我制作了两个自定义指令，我在任何HTML代码中都使用它们，比如

<div textbox-component > </div> <div grid-component ></div>

第一个呈现一个文本框和一个按钮。当我们点击按钮时，它返回一个Object.I想要将该对象传递给第二个指令，该指令获取对象并生成一个表。它是否可能以任何方式在Angular JS。

Answer 1

是的，使用从父作用域共享的$scope上的属性。我在这里使用控制器作为父作用域：

module.controller('foo', function($scope) {
    $scope.bar = {};
});

module.directive('textboxComponent', function() {
return {
    ...
    scope: {
        sharedObj: '=' 
    },

    link: function($scope) {
        $scope.doSomething = function() {
            $scope.sharedObj.test = 'hello world!'.  
        }
    }
};
});

// same definition using `scope` for gridComponent

现在你设置了范围对象：

<div ng-controller="foo">
    <div textbox-component shared-obj="bar">
        let us assume what follows inside is the template of this component

        <a ng-click="doSomething()">click me</a>
    </div>
    <div grid-component shared-obj="bar">
        let us assume what follows inside is the template of this component

        {{sharedObj.test}}
    </div>
</div>

在gridComponent的链接功能中，如果您需要知道sharedObj何时从外部更改（另一个指令），您也可以执行此操作：

$scope.$watch('sharedObj', function() {
    console.log($scope.sharedObj.test);
}, true);

你也可以使用$broadcast，但在这种情况下这是完全错误的......

如何在另一个自定义指令中访问一个自定义指令中的变量值

1 个答案: