javascript - AngularJS:如何在不通过多个 $parent 导航的情况下访问最顶层的范围?

标签 javascript angularjs angularjs-scope

我知道有很多关于这个的问题,但我找不到我的答案。
我的弹出窗口有一个指令,它有很多模板,

HTML

<popup template="popupTemplate"></popup>

指令

app.directive('popup', function () {
  return {
    restrict: 'E',
    scope: {
      template: '='
    },
    link: function ($scope, $element, $attrs) {
      // do something on $scope.template
    }
  }
});

现在在另一个元素上我为目标弹出窗口定义模板名称

<button popup-template="upload-avatar"></button>

指令

app.directive('popupTemplate', function () {
  return {
    link: function ($scope, $element, $attrs) {
      $element.bind('click', function () {
        $scope.$parent.popupTemplate = $attrs.popupTemplate;
        $scope.$apply();
      });
    }
  }
});

问题:
当我单击嵌套指令中的元素时。因为我需要处理:

$scope.$parent.popupTemplate
$scope.$parent.$parent.popupTemplate

这不是一个好主意。 我需要知道如何使用独特的语法而不是多个 $parent 访问第一个父作用域。

最佳答案

只需包装popupTemplate:

<popup template="whatever.popupTemplate"></popup>

然后你可以:

$scope.whatever.popupTemplate = $attrs.popupTemplate;

根本没有 $parent。

假设你有父作用域 A 和子作用域 B。默认情况下 B 复制 A 的所有值。这里的复制意味着复制指针。

在java中比较:

void bad(String s) {
    s = "new";
}

void good(String[] s) {
    s[0] = "new";
}

关于javascript - AngularJS:如何在不通过多个 $parent 导航的情况下访问最顶层的范围?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27638534/

相关文章:

javascript - jquery ajax 和子菜单

javascript - 如何更改相同的 ng-repeat 值并仅显示选择值

javascript - 如何从另一个模块调用函数

javascript - Oidc-Client js - 帧窗口超时 - 静默登录

javascript - Angular - 在页面加载时触发 $http.get

angularjs - 如何解决错误 “[$location:nobase] $location in HTML5 mode requires a <base> tag to be present!”

javascript - 如何读取插入到 ng-model 中的数据?

javascript dom td href

javascript - 隐藏多个 div,直到鼠标悬停在各个链接上,然后显示每个

javascript - 使用 replaceWith() 替换数组中的逗号?