angularjs - 访问父指令中子指令变量的值

Question

如何在父指令中访问子指令的变量？我有一个父指令，例如：

<parent-directive>
  <child-directive></child-directive>
</parent-directive>

子指令包含一个对象“states.visible”，我想在父指令中访问它。

Answer 1

我认为 AngularJs 这样做的方式可以通过在子指令中实现输出来完成。每次“状态”对象发生变化时，孩子都会调用输出函数，而父母可以用它做任何事情。

AngularJS v1.5+ 方法：

HTML

<parent-directive>
  <child-directive on-state-change="$ctrl.stateChange($stateChangeObj)"></child-directive>
</parent-directive>

儿童控制器

    $scope.$watch('$ctrl.state', function(n, old){
        ctrl.onStateChange({$stateChangeObj: n});
    })

父控制器

ctrl.stateChange = function(state){
    // do something
}

https://docs.angularjs.org/guide/component#component-based-application-architecture

注意：基于组件的架构是在 AngularJS v1.5 中引入的。

---

在 AngularJS v1.5 之前的方法：

这在技术上应该与双向绑定功能相同。除了 html 看起来像这样

on-state-change="$ctrl.stateChange"

代替

on-state-change="$ctrl.stateChange($stateChangeObj)"

. 然后在孩子身上

ctrl.onStateChange(n);

代替

 ctrl.onStateChange({stateChangeObj: n});