angularjs – 使用$$prevSibling访问“转发”指令中的范围数据可

发布时间：2020-12-17 09:41:20 所属栏目：安全来源：网络整理

导读：我的指令设置如下： div data-directive-a data-value="#33ff33" data-checked="true" div data-directive-b/div/div 我正在使用transclusion来确保directiveB被渲染. directiveA有一个复选框,这意味着每当检查时更改一些值. 该值需要在指令A和指令B的范围内

我的指令设置如下：

<div data-directive-a data-value="#33ff33" data-checked="true">
  <div data-directive-b></div>
</div>

>我正在使用transclusion来确保directiveB被渲染.
> directiveA有一个复选框,这意味着每当检查时更改一些值.
>该值需要在指令A和指令B的范围内访问.

我已经设法做到这一点,但只有通过引用$$prevSibling – 有更好的方法吗？

以下是代码：http://jsfiddle.net/janeklb/yugQf/(在此示例中,单击该复选框仅用于“清除”值)

–

更深入：
指令A(正在转录到其中)的“内容”并不总是指示B.其他指令B类的指令也将在那里结束.在指令A中将始终使用directiveB“类型”.

为了避免将组件耦合得太多,我将避免使用$$prevSibling.最好的解决方案,因为你的directiveB类组件预计在directiveA组件中使用是使用require.

.directive( 'directiveB',function () {
  return {
    require: '^directiveA',scope: true,link: function ( scope,element,attrs,directiveA ) {
      scope.obj = directiveA.getObj();
    }
  };
})

^ require表示此指令的元素某处或DOM层次结构中的任何元素都是一个directiveA指令,我们想在其控制器上调用方法.

.directive( 'directiveA',function () {
  return {
    // ...
    controller: function ( $scope ) {
      // ...
      this.getObj = function () {
        return $scope.obj;
      };
    }
  };
})

所以现在在directiveB中,你可以使用ng-model =“obj.attr”.

这有很多变化,但考虑到这个问题是多么的普遍,我觉得这是最好的办法.这是一个更新的小提琴：http://jsfiddle.net/yugQf/7/.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!