如何检测 Angular2 中的变量变化

2023-11-25

我有以下配置对象,它是在构造函数运行之前设置的:

config: Object = {
     onSlideChangeEnd : function(slide:any) {
          this.currentSlideIndex = slide.activeIndex;
     }
};

我想通知服务有关更改,问题是设置配置后该服务尚不可用:

 constructor(private user: UserService,
             private layout: LayoutService) {
 }

我如何通知服务此变量更改?


嗯,正如建议使用 Observables 一样,这并不是一个很大的麻烦,而且效果很好。实际上不超过几行。

在一些公共服务中声明它们共享相同的服务,例如在该模块中声明为提供者的服务,这样您就不会得到同一服务的两个实例。添加一个Subject该服务和发出值的方法:

public configObservable = new Subject<number>();

emitConfig(val) {
  this.configObservable.next(val);
}

在组件中您需要设置配置:

emit(val) { // your value you want to emit
  this.myService.emitConfig(val);
}

然后在需要的地方订阅该值:

constructor(private myService: MyService) {
  this.myService.configObservable.subscribe(value => {
    this.value = value;
  })
}

在父子交互中使用上面的代码进行工作:

Plunker

至于你的评论@Input(),这在父组件与子组件交互时效果很好,因此在这种情况下这对您来说并不适用。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何检测 Angular2 中的变量变化 的相关文章

  • 如何确定所有角度2分量都已渲染?

    当所有 Angular2 组件完成渲染时 是否会触发一个角度事件 For jQuery 我们可以用 function 然而 对于 Angular2 当domready事件被触发 html 只包含角度组件标签 每个组件完成渲染后 domrea
  • 订阅的角度替代方案?

    我使用的是异步订阅 因此计数器变量在更新之前被返回 是否有另一种订阅方法 允许我仅在计数器变量更新为从后端获取的值后才返回计数器变量 makeOffer product string offer number number let form
  • 无法获取子 DOM 元素

    注 由于问题有点复杂 为了可读性对代码进行了抽象 We ve a
  • Angular 2 管道状况良好

    Angular 2 是否可以在一定条件下应用管道 我想做这样的事情 variable text variable value SomePipe OtherPipe 如果不是 达到这种效果的首选方法是什么 您需要稍微更改一下语法 variab
  • 是否有任何有角度的日期前管道?

    我正在尝试创建帖子共享网站 我想以角度创建日期前管道 import Pipe PipeTransform from angular2 core Pipe name messageTime pure false export class Me
  • Angular 2 SPA Azure Active Directory JWT 问题

    想知道是否有 Azure Active Directory Angular 2 Adal 专家可以提供帮助 我的设置如下 具有三个应用程序注册的 Azure Active Directory 一种用于 Web API 一种用于 WPF 应用
  • router.navigate 不起作用(Angular6,延迟加载)

    我是 Angular 4 的新手 目前使用 v 6 我一直在尝试使用this router navigate 登陆 从登录组件重定向到登陆组件的功能 它无法正常工作 它将显示登录页面一秒钟 然后再次重定向回登录页面 但是 例如 如果我尝试浏
  • RxJ 从 observable 中获取价值

    在组件中 singleEvent Observable
  • 跨浏览器:禁用输入字段的不同行为(文本可以/不能复制)

    我有一个被禁用的输入 html 字段 在某些浏览器 Chrome Edge Internet Explorer 和 Opera 中可以选择并复制文本 但至少在 Firefox 中这是不可能的 您可以通过在不同浏览器中执行以下代码来测试
  • 根据 main.ts 中的 URL 引导多个或单个模块

    我正在使用一个 NET Framework MVC Web项目 该项目无法完全转移到完整的角度项目 因此我无法使用角度的路由来延迟加载 但我也不想加载使用角度组件的所有内容 这是一个企业解决方案 要说 嘿 让我们充分利用 Angular 并
  • 检测 Angular 项目中的浏览器刷新

    我想使用我的路由器来检测页面何时刷新单页应用程序 https en wikipedia org wiki Single page application 角度项目 还有其他方法吗 In the 组件 ts file import Subsc
  • 使用占位符和 ngModel 动态生成输入元素

    我想以角度 2 动态生成输入元素 我有占位符标题数组和值数组 如下所示 在我的组件中 我有两个映射 如下所示 其中两个映射的键相同 将值映射到标题 const placeholderMap fullName Name value Produ
  • rxjs/Subject.d.ts 错误:类“Subject”错误地扩展了基类“Observable

    我从中提取了示例模板代码本教程 https github com gopinav Angular 2 Tutorials并执行以下两个步骤来开始 npm install worked fine and created node module
  • 在 .NET Core 中为 SPA 生成角度包时如何解决错误失败?

    当我执行该应用程序时 我收到两个红色失败消息 如下所示 通常 当类型或其他方面出现错误时 失败 Microsoft AspNetCore SpaServices 0 生成浏览器应用程序包 失败 Microsoft AspNetCore Sp
  • 打字稿中枚举声明中的方括号的含义是什么?

    我正在浏览一个名为 Angular ngrx 项目的打字稿文件collection ts在那里 我看到声明了以下枚举常量 import Action from ngrx store import Book from models book
  • 修改nrwl nx项目中的tsconfig和tslint文件后需要重新启动VSCode以消除错误

    我正在 VSCode 中使用 Nrwl nx 开发一个项目 每当我更改库的路由或库的前缀时 我的代码都会显示一堆错误 一切仍然按预期呈现 但我需要重新启动 VSCode 以使所有红线和文本消失 为什么会发生这种情况 有没有办法在终端中执行某
  • Angular 2 验证状态

    我使用 Angular 2 实现了一个登录页面 登录后 我从服务器获取 jsonwebtoken userId userRole userName 我将此信息存储在本地存储中 以便我可以随时访问它并在用户刷新页面时保持登录状态 AuthSe
  • 在 Angular 中刷新 owl-carousel

    我对猫头鹰旋转木马有一些关于动态变化的问题 例如幻灯片的数量等 换句话说 旋转木马在进行一些更改后很容易损坏 我的方法是重新加载 刷新轮播 但如何呢 我在网上发现必须按班级刷新 owl trigger refresh owl carouse
  • 如何获取 RxJSSubject 或 Observable 的当前值?

    我有 Angular 2 服务 import Storage from storage import Injectable from angular2 core import Subject from rxjs Subject Inject
  • 在 Angular2 项目中集成 Treant-js

    我正在尝试在 Angular2 项目中使用 treant js 但我正在努力解决如何正确集成它的问题 我有一个工作正常的 JavaScript HTML 示例 我正在尝试在 Angular2 中工作 我创建了一个组件 从 npm 添加了 t

随机推荐

  • ASP.Net MVC 6 中的全局错误日志记录

    我正在测试 MVC 6 Web Api 并希望实现登录到全局错误处理程序 只是保证没有错误会在没有被记录的情况下离开系统 我创建了一个 ExceptionFilterAttribute 并将其全局添加到启动中 public class Ap
  • Angular2 http 重试逻辑

    我有一个带有基于令牌的身份验证机制的 API 成功登录后 我在浏览器的本地存储中存储两个令牌 访问令牌和刷新令牌 访问令牌包含在服务器端授权用户所需的所有必要信息 并且具有到期日期 当访问令牌过期时 客户端可以使用刷新令牌请求新的访问令牌
  • 如何使用新线程库中的 Task.Wait For Any?

    尝试使用Delphi中的线程库并行计算任务并使用TTask WaitForAny 为了得到第一个计算结果 偶尔会出现异常停止执行 异常时的调用堆栈 第一次机会例外 价格为 752D2F71 美元 异常类 EMonitorLockExcept
  • TextView 中的整数值

    如何在 TextView 中显示整数值 当我尝试时 出现错误android content res Resources NotFoundException String resource ID TextView tv new TextVie
  • 如何在Java 8中逐行读取文件?

    在Java 8中 我看到Files类中添加了名为lines 的新方法 该方法可用于在Java中逐行读取文件 它适用于大文件吗 我的意思是我们可以加载前 1000 行 然后加载第二组 1000 行吗 我有 1GB 的大文件 可以吗 有人可以分
  • 狮身人面像和“你的意思是……?”建议想法。它会起作用吗?

    我正在尝试想出最快的方法来提出搜索建议 起初我认为 Levenstein UDF 函数与 mysql 表相结合就可以完成这项工作 但是使用 levenshtein mysql 必须遍历表中的每一行 大量的单词 这会使查询非常慢 现在我最近安
  • 如何用等角透视进行渲染? [复制]

    这个问题在这里已经有答案了 可能的重复 使用opengl进行真正的等角投影 我想使用 Blender3d 使用的相同等距渲染进行渲染 我该怎么做 是否可以仅调用 glMultMatrix 我尝试谷歌搜索 但找不到任何可以导致这种渲染模式的工
  • Kotlin 中默认构造函数中的两个附加类型?

    自从我一直在使用kotlin 反射为了调用我的默认值和声明的构造函数 我看到了第二个不同的构造函数 我意识到两个不同的领域int arg3 and kotlin jvm internal DefaultConstructorMarker a
  • Visual Studio 2015 中的 TFS 生成资源管理器在哪里?

    我在 Windows 8 上运行 Visual Studio Enterprise 2015 RTM 在 Visual Studio 2013 中 构建资源管理器位于团队资源管理器 gt 构建 gt 操作 gt 管理队列中 Visual S
  • Typescript 泛型中对接口成员的约束

    我有一个方法 应该接受任何对象 只要它的所有字段都是字符串或数字 我做了这个 它非常适合鸭子打字 static interpolateParams route string params key string string number s
  • 一个很好的 C 随机数生成器

    我需要一个好的随机数生成器来用于我用 C 编写的程序 如果您感兴趣的话 它是一个分形火焰生成器 尽管我过去使用相同的算法取得了成功 但我的图像仍然非常粗糙 我最终意识到 区别在于我使用的随机数生成器 令人难以置信的是 它产生了巨大的变化 我
  • Linq 查询适用于 null 但不适用于 int?在 where 子句中

    我有一个像 简化的 的 linq 查询函数 public IList
  • Windows Phone 8.1 位置跟踪

    我想实现一个将设备位置持续发送到网络服务的应用程序 查看文档 我发现了 Geolocation 类和一些讨论位置跟踪的文章 如何持续跟踪 Windows Phone 8 手机的位置 如何在 Windows Phone 8 后台运行位置跟踪应
  • java中如何调整文本大小

    我发现在 Photoshop 中 只需拖动文本即可轻松调整文本大小 我们如何在 Java 中做同样的事情 关于如何在java中调整文本大小有什么想法吗 添加了在 Photoshop 中调整大小的字母 A 的快照 请让我知道这段代码有什么问题
  • 如何使用 XPath 获取属性的值

    我一直在使用 Selenium WebDriver 进行测试 并且一直在寻找 XPath 代码来获取 HTML 元素的属性值 作为回归测试的一部分 但我找不到一个好的答案 这是我的示例 html 元素 div class firstdiv
  • 如何实现android视频播放器全屏播放

    我已经实现了android视频播放器 但我不需要像这样我需要什么意思当我打开活动时我需要支付视频半屏在中心当我点击按钮全屏按钮然后我需要全屏支付 如何实现它帮助我 视频播放器活动 public class VideoPlayerActivi
  • 如何在intellij idea编辑器中删除顶行面包屑?

    我在弄清楚 IntelliJ Idea Community Edition 15 中的此显示栏时遇到问题 有谁知道这是什么和 或如何将其关闭 它被称为当前代码位置的面包屑菜单 例如 在您的图像中 您处于类 Display gt 方法 Dis
  • 通过 JDBC 集成 Spark SQL 和 Apache Drill

    我想根据使用 Apache Drill 对 CSV 数据 在 HDFS 上 执行查询的结果创建 Spark SQL DataFrame 我成功配置了 Spark SQL 使其通过 JDBC 连接到 Drill Map
  • 如何将 JSON 格式的数据从 WebView 传递到 HTML 页面

    我正在尝试将 JSON 格式的数据从 Android WebView 传递到 HTML 页面 但是 每当我尝试解析原始 JSON 数据时 应用程序就会崩溃 我希望其格式为 key data 我的应用程序的目标是解释此 JSON 数据 将其形
  • 如何检测 Angular2 中的变量变化

    我有以下配置对象 它是在构造函数运行之前设置的 config Object onSlideChangeEnd function slide any this currentSlideIndex slide activeIndex 我想通知服