首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >从我的指令中,如何手动触发父作用域上的摘要周期?

从我的指令中,如何手动触发父作用域上的摘要周期?
EN

Stack Overflow用户
提问于 2015-08-04 07:26:15
回答 2查看 5.7K关注 0票数 2

我有一个指令,当以编程方式对底层模型进行更改时,我希望强制呈现。$scope.$apply是惯用的。但是,如果不反复单击UI (这可能是手动强制摘要),我无法获得要呈现的指令。

有人能帮我识别如何手动触发摘要吗?

即使是this.scope.$root.$apply()也没有效果。

但是,抓取父DOM节点并获取相关的作用域,然后从控制台调用$apply确实有效。

但是,在代码中使用此DOM节点方法时,它不起作用。为什么会这样?

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2015-08-04 16:41:28

有两件事要注意:

  1. 作用域相互继承,并形成树。作用域具有对$parent的引用,可用于遍历。
  2. 摘要周期是发生在作用域对象上的事情。即。$scope.$digest()。这将对作用域运行摘要,然后递归地对所有子作用域执行相同的操作。$scope.$apply()就像做$rootScope.$digest()一样。因为它是从根目录开始的,所以它调用了每个其他范围的摘要。所以$apply可能是过量的。

要回答您的问题,scope.$parent.$digest()将触发scope的父母的摘要。

但似乎引发文摘其实并不是你的问题。$apply将在所有作用域上触发摘要,所以如果这不适用于您,我不认为您的问题只是需要触发摘要。

也许您不需要整个指令来重新呈现,而只需要它的一部分来更新?如果是这样,请考虑将数据绑定到某些共享服务(如 )。

HTML

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<div ng-app='app'>
  <one></one>
  <two></two>
</div>

JS

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
angular
  .module('app', [])
  .directive('one', function() {
    return {
      restrict: 'E',
      scope: {},
      template: "<input ng-model='shared.val'> {{ shared.val }}",
      controller: function($scope, Shared) {
        $scope.shared = Shared;
      }
    };
  })
  .directive('two', function() {
    return {
      restrict: 'E',
      scope: {},
      template: '<p> {{ shared.val }}</p>',
      controller: function($scope, Shared) {
        $scope.shared = Shared;
      }
    };
  })
  .factory('Shared', function() {
    return {
      val: ''
    };
  });
票数 4
EN

Stack Overflow用户

发布于 2015-08-04 09:57:37

这在某种程度上取决于。听起来,$parent就是你想要的名字。scope.$root只保存对$rootScope的引用(而不是父元素范围)。简短的回答-尝试以下..。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
scope.$parent.$apply()

更长的答案-以上假设您的子指令作用域是通过scope: true从父继承的。有关主题和访问父作用域的其他可能方法的更多详细信息,请参见回答在AngularJS?在父作用域中获得句柄后,只需在其上调用$apply()即可。

我已经做了一个例子,它修改了jQuery .click()事件的父作用域。考虑以下情况并观察父母的行为..。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
app.directive('parent', function() {
    return {
        link: function(scope, elem, attrs) {
             scope.value = 'parent'            
        }
    }
});

app.directive('child', function() {
    return {
        scope: true,
        link: function(scope, elem, attrs) {

            scope.value = 'child'

            elem.click(function() {
                scope.$parent.value = 'modded!!' // -- previously 'parent' 
                scope.$parent.$apply();
            })
        }
    }
});

JSFiddle链路 -工作示例

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/31813267

复制
相关文章
[喵咪PHP]页面显示空白问题
#[喵咪PHP]页面显示空白问题# ##前言## 哈喽!大家好啊,喵咪PHP第一次和大家见面了,熟悉的朋友呢也之道喵咪我也开了喵咪Liunx和喵咪Golang这两个坑目的呢是吧平常遇到的一些问题或者是
喵了个咪233
2018/03/02
2.2K0
[喵咪PHP]页面显示空白问题
AngularJS系列之select下拉选择第一个选项为空白的解决办法
今天给大家介绍一下AngularJS系列之select下拉选择第一个选项为空白的解决办法。 相信大家也经常遇到这种情况吧:在使用AngularJS中的select组件开发的时候,莫名其妙的第一个选项就
林老师带你学编程
2018/01/03
3.2K0
centos打开windows的ftp 无法显示内容 显示空白内容
centos下gnome打开windows FTP显示空白,无内容,windows下 打开正常。
全栈程序员站长
2022/07/05
6.3K0
centos打开windows的ftp 无法显示内容 显示空白内容
7个有用的Pandas显示选项
andas是一个在数据科学中常用的功能强大的Python库。它可以从各种来源加载和操作数据集。当使用Pandas时,默认选项就已经适合大多数人了。但是在某些情况下,我们可能希望更改所显示内容的格式。所以就需要使用Pandas的一些定制功能来帮助我们自定义内容的显示方式。
deephub
2023/02/01
1.3K0
显示器 设置选项 解析
明亮度 Gama:显示器的输出图像对输入信号的失真程度。 DCR:Dynamic Contrast Ratio,动态对比率。自动判断画面整体亮度,对画面各部分进行亮度调整,使细节更清晰,层次更分明。 颜色设置 色温 暖色 正常 冷色 sRGB:RGB(色彩空间)的一种标准。 DCB模式 OSD设置 其他 DDC/CI:Display Data Channel Command Interface,基于DDC/CI协议,用户可以通过鼠标和人性化的软件界面来完成显示器的各项设置和色彩调节,
JNingWei
2018/09/28
1.6K0
图片的选择和显示
这个就是图片的选择框,在我们点击这个框的时候会给我们弹出一个文件选择,当我们选中图片的时候就把图片显示在这个框上面,如果选中的不是一个图片这个时候就需要用到一个正则表达式来进行一个判断。
PHY_68
2020/09/16
1K0
图片的选择和显示
Windows 预览体验计划 空白 不显示内容
以管理员身份启动 PowerShell,可以直接在搜索框中搜索,右键选择“以管理员身份运行”
季春二九
2023/03/22
9090
Windows 预览体验计划 空白 不显示内容
部分手机访问https显示空白页
事情是这样的。。。。。此处省略1000字!
思梦php
2018/03/01
1.4K0
部分手机访问https显示空白页
部分手机访问https显示空白页
突然客服告诉我,众享通赢的消费平台怎么登陆不进去了???而且还一直显示空白页???,程序员你做了什么了???额,,然后我表示一脸懵逼....
思梦php
2018/03/16
3.1K10
部分手机访问https显示空白页
OpenCV基础03--创建空白图像和显示
以下程序也与以前的程序非常相似。唯一的区别是该程序创建一个空白图像,而不是从文件加载现有图像。
软件架构师Michael
2023/09/11
5280
Confluence 6 修改导航显示选项 原
https://www.cwiki.us/display/CONF6ZH/Configure+the+Sidebar
HoneyMoose
2019/01/30
1.4K0
Confluence 6 修改导航显示选项
                                                                            原
uniapp组件引入canvas显示不出来空白
2023/10/18
9820
uniapp组件引入canvas显示不出来空白
dedecms后台左侧菜单空白不显示怎么处理
  有一位网友反映说迁移服务器后,进入dedecms后台发现左边菜单一片空白,显示不出来,遇到这种现象一般是空间的权限问题,没有写入权限,修改一下空间的目录权限就可以了,   1.首先进行判断是程序问题还是权限问题。通常这种都属于权限问题。   2.使用FTP登陆网站。找到DATA/tplcache 文件夹。将里面的数据备份。   3.在文件夹上面右键。并设置其属性为777。然后将里面的文件除了index.html文件外全部删除。   4.刷新后台。问题解决,dede后台菜单正常显示!   有些朋友
ytkah
2018/03/06
6.5K0
localStorage 的相关运用
localStorage 是浏览器自带的一个属性,只读的localStorage 属性允许你访问一个Document 源(origin)的对象 Storage;存储的数据将保存在浏览器会话中。localStorage 类似 sessionStorage,但其区别在于:存储在 localStorage 的数据可以长期保留;而当页面会话结束——也就是说,当页面被关闭时,存储在 sessionStorage 的数据会被清除。
子舒
2023/08/23
2730
localStorage 的相关运用
部分手机访问https显示空白页
突然客服告诉我,众享通赢的消费平台怎么登陆不进去了???而且还一直显示空白页???,程序员你做了什么了???额,,然后我表示一脸懵逼....
思梦php
2018/02/10
1.5K0
部分手机访问https显示空白页
选择篇(017)-哪个选项是不正确的?
在JavaScript中,所有对象键都是字符串(除了Symbol)。尽管有时我们可能不会给定字符串类型,但它们总是被转换为字符串。
齐丶先丶森
2022/05/12
1.3K0
Labview选项卡之实现被选择选项卡工作
有些时候,我们做界面,需要好多个界面切换。如果是同一个 VI 里界面切换,一般都是选项卡了。切换不同选项卡就切换界面了。
Gnep@97
2023/08/16
7681
Labview选项卡之实现被选择选项卡工作
Bootstrap 初级错误导致显示空白页
在官网下载bootstrap代码,引入js、css、font文件,然而项目启动之后整个页面只是空白,怎么刷新重新部署都无法显示内容。
程序新视界
2022/05/06
7350
echarts插件-从后台请求的数据在页面显示空白的问题
最近的项目里面关于统计图方面的问题,有涉及到很多,也在博客里面更新了自己所遇到的问题,开发过程中会遇到很多问题,解决技术问题的方法也有千千万
王小婷
2018/08/22
1.2K0
echarts插件-从后台请求的数据在页面显示空白的问题
点击加载更多

相似问题

LocalStorage选择已禁用

12

Jquery链式选择框,如何禁用空白选项

16

如何在选择AngularJS中禁用空白选项?

10

ng-带localStorage选项的显示

10

多选择下拉列表显示选项为空白?

10
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文