首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

我的behaviourSubject在加载angular 9中的页面时返回null,它没有用当前值更新

问题描述: 我的behaviourSubject在加载angular 9中的页面时返回null,它没有用当前值更新。

解答: 在Angular 9中,当页面加载时,behaviorSubject可能会返回null,因为它的值还没有被更新。behaviorSubject是一种可观察对象,它可以用来共享数据,并且在订阅者之间传递最新的值。但是,在页面加载时,如果behaviorSubject还没有被更新,它的值将是null。

要解决这个问题,你可以采取以下步骤:

  1. 确保在页面加载之前,behaviorSubject已经被更新了。你可以在组件的构造函数中初始化behaviorSubject,并给它一个初始值。
  2. 在订阅behaviorSubject之前,检查它的值是否为null。如果是null,你可以选择使用默认值或者等待behaviorSubject的值被更新后再进行订阅。
  3. 确保在更新behaviorSubject的值时,使用next()方法而不是直接赋值。next()方法会通知所有的订阅者,使它们能够接收到最新的值。
  4. 如果你的behaviorSubject的值在页面加载后仍然为null,那么可能是因为数据的获取或更新过程出现了问题。你可以检查数据获取的逻辑,确保数据被正确地获取和更新。

总结: 在Angular 9中,behaviorSubject在页面加载时可能会返回null,因为它的值还没有被更新。为了解决这个问题,你可以在页面加载之前初始化behaviorSubject,并在订阅之前检查它的值是否为null。同时,确保在更新behaviorSubject的值时使用next()方法,并检查数据获取和更新的逻辑是否正确。

相关搜索:为什么我的页面在重新加载时当前无法登录?每次我点击返回时,在我的管理页面上,它显示“文档过期”在关闭xamarin视图时,我收到错误:当根页面也是当前显示的页面时,无法删除它chartjs-plugin-zoom:在页面首次加载时获取当前可见的值在Angular中,有没有办法在页面加载时更改某个变量的值?我的redux数据在页面加载时没有加载,并且我的映射函数返回未定义jQuery将div中的值存储在cookie中,并在页面刷新时加载它如果我不重新加载页面,Angular应用程序上的LocalStorage会返回旧值为什么我的redux状态在页面刷新时返回到初始值?我使用的是angular6,在最初加载页面时,标记ng-content中的内容不会显示为什么我的Auth.currentAuthenticatedUser()方法在我重新加载后返回更新的状态,而不是在useEffect的依赖项运行(或登录/注销)时返回?我可以在html页面中保存文本框/下拉菜单选择的值,以便再次加载它吗?我尝试访问元组的值,但当尝试在Python中创建保存/加载方法时,它显示有太多的值需要解包如何使我的密码提示只在我打开网站时出现一次,而不是每次我重新加载页面或重新访问它时都显示为什么将eventlistner添加到我的动态创建的图像在更新到Angular 8后在页面加载时都会触发在document_end上填写表单时,我的脚本单击一个按钮,该按钮会重新加载页面,以便再次运行。如何停止它的运行?在我的Google Search API调用中,它返回了一个有效的JSON,但是每当我解析它以获得一个特定值时,我就会得到一个未定义的值我在引导模式下使用jQuery和AJAX从数据库获取一些数据,但是当我试图更新一些记录时,它给出了不正确的值
相关搜索:
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

AngularDart4.0 英雄之旅-教程-06服务 顶

进行更改时,请通过重新加载浏览器窗口来保持运行。 创建一个英雄服务 利益相关者希望以不同页面以各种方式展示英雄。 用户可以从列表中选择一个英雄。...现在Angular知道创建一个新AppComponent要提供一个HeroService实例。 依赖注入页面阅读更多关于依赖注入内容。...当组件实现该方法Angular会在适当时候调用它。 “Lifecycle Hooks”页面中详细了解生命周期挂钩。...英雄服务返回一个Future Future代表未来计算或。 使用Future,您可以注册回调函数,计算完成(结果准备就绪),或需要报告计算错误时调用。 这是一个简单解释。...添加dart:async导入,因为定义了Future,并使用这个Future返回getHeroes()方法更新HeroService:lib/src/hero_service.dart (excerpt

2.9K10

如何使用WijmoJS 纯前端设计器,快速生成 Angular 应用

用户设计器中进行更改后,只需单击一下,就可以使用修改后Angular标记更新原始HTML文件。...安装最简单方法是打开VS Code并转到Extensions窗格。 搜索框中键入wijmo,然后单击“安装”按钮开始下载扩展。 出现时单击“重新加载”按钮以完成安装。...但是,当扩展更新源文件,将保留原始控件标记中定义任何现有事件处理程序。 设计器独立命令会记住当前工作空间上下文中可视化设计界面的状态,即使您关闭并重新打开VS代码也是如此。...在这种情况下,设计器以斜体显示只读文本框中绑定。 保存操作期间保留绑定事件; 但是,设计器中没有用于创建或编辑它们界面。...有关Angular标记的当前限制列表,请参阅Visual Studio Marketplace上扩展页面

5.4K40
  • AngularJSdigest循环和$apply

    最近在写AngularJS,遇到一个问题,Ajax异步请求后台数据,然后将结果赋值给当前scope中某对象属性,页面中怎么都取不到,然而在js端却可以正常打印出来。...一、传统事件触发 标准浏览器流程中,页面加载、$http请求返回响应、鼠标移动以及按钮被点击等情况都会触发事件。...当事件被触发(比如点击一个链接),JavaScript会创建一个事件对象,并执行这个事件对象所在监听特定事件所有函数。然后浏览器会执行注册给该事件回调函数,更新DOM。...三、页面$digest循环 (1)angular会设置一个隐式监控器,将输入字段绑定为当前...循环之前,会触发该(ng-model)上运行验证和格式化操作; (5)由于digest循环中值发生了变化,angular需要再次运行这一循环以确定没有改变作用域对象上其他

    3.2K41

    【面试题】hash 与 history 路由实现原理

    使用浏览器访问网页,如果网页URL中带有hash,页面就会定位到id(或name)与hash一样元素位置,故而又称之为锚点。...hash还有另一个特点,改变不会导致页面重新加载,因此单页应用流行的当下,用处就更多了。通过window.location.hash属性获取和设置hash。...更新页面而不发送 http 请求 2. 使用 history 模式,需要通过服务端来允许地址可访问 3....没有用到 // 参数三 跳转路径 window.history.pushState({to},null,to) } // 覆写window.history.pushState方法 //...window.history对象,该对象上包含有length和state两个__proto__上继承有back、forward、go等几个功能函数 popstate之前,我们可以利用back

    1.5K10

    记录工作中遇到各种问题(Bug,总结,记录)

    页面使用Angular.js(1),页面中iframe中初始设置src属性的话,会导致页面重新加载一次 例如设置一个初始,某些操作之后再更改src <iframe src="#" class="export-iframe...第三个坑是<em>它</em>给只读<em>的</em>style属性赋值,这种方式<em>在</em>严格模式是被禁止<em>的</em>,而这插件正好自个又用了严格模式 坑就坑<em>在</em>:<em>在</em><em>Angular</em>.JS(1)环境下使用iPad<em>的</em>时候才报错,PC上用<em>Angular</em>.JS正常...<em>在</em>离开<em>当前</em><em>页面</em><em>时</em>判断是否有更改,做出提示 新版本浏览器基于安全机制,不能设置提示<em>的</em>样式,也不能设置提示中操作(确认和取消)<em>的</em>回调,也不能设置提示<em>的</em>文案(旧版<em>的</em>可以设置文案) ? ?...一堆<em>的</em>不清晰之中,尝试尽可能地<em>在</em>减小请求数与减小资源大小直接做平衡, 尽可能地让关键<em>的</em>资源<em>在</em>最先<em>的</em>并行顺序中<em>加载</em>,<em>页面</em>整体<em>加载</em>感觉就快多了 难点TTFB还与资源<em>的</em><em>加载</em>时机有关?...原因是浏览器自身缓存了<em>当前</em>时间<em>值</em>。 当修改<em>的</em>时间变化比较小时(比如改变几分钟)能<em>更新</em>到正确<em>的</em><em>值</em> 改变比较大<em>时</em>(比如改变几十分钟或几天),这个<em>值</em><em>在</em>一分钟左右才会<em>更新</em>出来 70.

    18.1K12

    AngularDart4.0 英雄之旅-教程-08HTTP 顶

    当你完成这个页面,应用程序应该看起来像这个实例(查看源代码)。 你离开地方 在前一页中,您学会了仪表板和固定英雄列表之间导航,沿途编辑选定英雄。 这是这个页面的起点。...响应JSON有一个单一数据属性,拥有主叫方想要英雄列表。 所以你抓住这个列表并把作为已解决Future返回。 请注意服务器返回数据形状。...通过id获取英雄 当HeroDetailComponent要求HeroService获取一个英雄,HeroService当前获取所有英雄并且过滤器以id匹配一个hero。...现在是时候添加创建和删除英雄能力了。 更新英雄细节 尝试英雄详情视图中编辑英雄名字。 当你输入时,英雄名字视图标题中被更新。 但是,如果您单击后退按钮,更改将丢失。 更新之前没有丢失。...终点直道 你旅程尽头,你已经完成了很多。 您添加了必要依赖关系,以应用程序中使用HTTP。 您重构了HeroService以从Web API加载英雄。

    11K30

    再谈angularJS数据绑定机制及背后原理—angularJS常见问题总结

    两者区别在于页面没有加载完毕 {{val}} 会直接显示到页面,直到 Angular 渲染该绑定数据(这种行为有可能将 {{val}} 让用户看到);而 ng-bind 则是 Angular 渲染完毕后将数据显示...当你写下表达式如{{ val }},AngularJS幕后会为你scope模型上设置一个watcher(表达式将被 Angular 编译成一个监视函数),它用来在数据发生变化时候更新view。...循环 新 $digest 循环未检测到变化 浏览器拿回控制器,更新 $scope. val.新对应 dom 调用了$scope....这些watchers会检查scope中的当前model是否和上一次计算得到model不同。如果不同,那么对应回调函数会被执行。...所以说不要怀疑用户输入表单 angular 会不会监听页面左边导航栏变化。 如何优化脏检查与运行效率 脏检查慢吗? 说实话脏检查效率是不高,但是也谈不上有多慢。简单数字或字符串比较能有多慢呢?

    7.8K40

    小程序手动定位

    index.js中未变量addresss赋值,然后index.wxml中就可以自动更新,这与angular很像,但是,小程序中是单项绑定。...tap是一个触摸事件,小程序中使用bind或者catch方式绑定事件,其属性是一个函数名称,这个函数index.js中定义,当用户触摸此view就会执行对应函数 逻辑层 index.js //引用腾讯地图...src:"" }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { /*判断是第一次加载还是从position页面返回...,同时将用户选择位置名称传递过去 index.wxml 中,有一段代码用来处理:如果用户点击 完成 前没有选择任何位置,则继续显示当前位置,否则显示用户选择位置。.../*判断是第一次加载还是从position页面返回 如果从position页面返回,会传递用户选择地点*/ if (options.address !

    60240

    Angular 从入坑到挖坑 - 组件食用指南

    安全导航运算符 视图中使用属性null or undefined ,javascript 和 angular 会引发空指针异常并中断视图渲染过程, 从而视图会渲染失败,而使用了安全导航运算符...非空断言运算符用来告诉编译器对特定属性不做严格校验,当属性null or undefined ,不抛错误。...name}} 非空断言运算符不会防止出现 null 或 undefined,只是不提示 4.3.2、常用管道函数 纯管道 只有检测到输入发生了纯变更才会执行,但是会忽略对象内部变更...五、组件生命周期钩子函数 当 angular 创建、更新、销毁组件都会触发组件生命周期钩子函数,通过组件中实现这些生命周期函数,从而介入到这些关键时刻 钩子函数 触发时机 ngOnChanges...组件加载过程中,会按照上面列出钩子函数顺序,组件构造函数执行之后依次执行,页面加载过程中会涉及绑定数据操作,因此会再次出发 ngDoCheck、ngAfterContentChecked

    15.8K30

    教程| Angular 4 中加载功能模块(上)

    请注意,本教程适用于熟悉使用 Angular 进行基本 Web 应用程序开发开发人员。 Angular功能模块 单页 Web 应用程序启动仅呈现一个 HTML 页面。...预加载加载场景中,主应用程序启动所有标为贪婪加载模块,然后几乎立即在后台加载 。当用户导航到这些辅助模块中某个模块,就会加载该模块并准备就绪。...出于本教程目的,假设应用程序用户最感兴趣是获取有关金融市场和体育项目的更新。您首先要加载这些模块,随后加载货币和天气模块。...前提条件 要掌握本教程,需要在开发机器上安装两个工具: Node Angular CLI 输入命令 ng -v,以便找到您当前使用 Angular CLI 和 Node 版本。...如下所示,使用是 Node 7.9.0 和 Angular CLI 1.0.2。

    2.2K10

    【Hybrid开发高级系列】AngularJS(一)——基础专题

    推荐将angular组件独立分离不同文件中,module文件中声明module,其他组件则引入module,需要注意是在打包或者script方式引入时候,我们需要首先加载module声明文件,然后才能加载其他组件模块...当页面加载时候,AngularJS会根据输入框属性名字,将 其与数据模型中相同名字变量绑定在一起,以确保两者同步性。         ...因为浏览器载入页面,同时也会请求载 入图片,AngularJS页面载入完毕才开始编译——浏览器请求载入图片时{{phone.imageUrl}}还没得到编译!...false         以上方法为查看当前状态是否某父状态内,比如 $state.includes('contacts') 返回 true / false ui-sref-active 查看当前激活状态并设置...鉴于AngularJS数据绑定,我们可以使用future并且把绑定到我们模板上。然后,当数据到达,我们视图会自动更新

    53980

    🔥【Angular教程】路由入门

    路由定义配置需要携带参数令牌 格式: 路由配置path后补充格式为/:key令牌占位 { path: 'detail/:id', component: UserDetailComponent...通过Routernavigate跳转页面 当前组件注入Router对象 无参数携带跳转: this.router.navigate(['/home/list']); 携带参数跳转: this.router.navigate...,避免首次打开页面就进行整体加载导致页面长时间不可用。...angularRouter模块提供来两种预加载策略: 完全不预加载,这是默认。惰性加载特性区仍然会按需加载。 预加载所有惰性加载特性区。...: 默认,不进行预加载 这么鸡肋属性必须要支持自定义,我们来看一下: 需要预加载路由配置对象中添加data对象并增加preload属性,设置为true表示开启预加载

    4.4K50

    hash和history路由模式

    我们熟知JS框架如react,vue,angular,ember都属于SPA 与之对应是多页面应用,他们区别如下 优点: 用户体验好、快,内容改变不需要重新加载整个页面,避免了不必要跳转和重复渲染...、CSS 统一加载,部分页面按需加载 SEO 难度较大:由于所有的内容都在一个页面中动态替换显示,所以 SEO 上其有着天然弱势。...早期前端路由实现就是基于location.hash来实现,location.hash就是URL中#后面的内容 其实现原理就是监听#后面的内容来发起Ajax请求来进行局部更新,而不需要刷新整个页面...事件,可以event.state里获取 title:标题,基本没用,一般传 null url:设定新历史记录 url,新 url 与当前 url origin 必须是一样,否则会抛错,url...单页应用 当我们浏览器地址栏输入一个地址,浏览器就会去服务端去请求内容。但每次点击一个链接,就去服务端请求,这样会有页面加载等待。

    19610

    达观数据对AngularJS技术思考与实践

    Model负责管理应用程序数据。响应来自视图请求,同时也响应指令从控制器进行自我更新。Veiw即视图,它以一种特定格式或者说样式来显示数据。...目前单页面应用越来越受欢迎,而Angular构建单页面应用上简直是标配。这样构建页面应用特点是单页、无刷新式页面变化,每个页面包含不同数据。...1)用Factory就是创建一个对象,为添加属性,然后把这个对象返回出来。...1)作用域原型继承:原型继承对变量赋值不会修改原型中,而是直接在当前scope中创建一个同名属性;但如果是变量是对象,则不会创建。即基本类型会重新创建变量,引用则不会。 ?...因此当你需要重用来自父控制器中功能,你所要做就是父作用域中添加相应方法。这样一来,自控制器将会通过作用域原型来获取父作用域中所有方法。 ?

    5.4K150

    使用.net core ABP和Angular模板构建博客管理系统(实现编辑页面功能)

    初步实现编辑更新功能 新建一个edit-note模块如下: ? 编辑模块 我们看看作者新建页面用到了什么, 用到了ngx-bootstrap弹出层。...返回列表后也没有自动更新 预览处也没实现实时预览 自动更新也没有实现 发布功能还没有实现 界面不够美观 返回列表更新 这个就要用到angular父子页面。...测试父子页面 实现实时预览 我们之前设计是使用markdown语法来制作这个编辑功能。...,添加描述功能还没有来得及开发,而且这两个字后台设置是必填字段'; this.noteServer.PublicNote(this.note).subscribe(m => {...1.gif 好项目是慢慢优化出来,一口是吃不出一个大胖子来,慢慢优化,一步步行动起来,才能遇见更好自己。 操作等待时候没有遮罩层,这种体验很不好。 操作成功或者失败也没有提示。

    1K30

    2021Vue.js面试题汇总及答案【全网最全 建议收藏】「建议收藏」

    有缓存,只有依赖 属性发生改变,下一次获取 computed 才会重新计算 computed 。...当 Vue.js 用 v-for 正在更新已渲染过元素列表默认用“就地复用”策略。...1.44.SPA 单页面的理解,优缺点分别是什么 SPA( single-page application )仅在 Web 页面初始化时加载相应 HTML、JavaScript 和 CSS 一旦页面加载完成...返回状态,通过 Getter暴露给 view层组件或者页面页面监测到状态改变于是更新页面。...注意:push方法跳转会向 history 栈添加一个新记录,当我们点击浏览器返回按钮可以看到之前页面。 2、go 页面路由跳转 前进或者后退this.

    8.7K30

    angular5面试题_大数据面试题

    Angular提供了一种平滑机制,通过我们可以将这些依赖项注入我们组件和指令中。因此,我们只是构建依赖关系,这些依赖关系可以应用程序所有组件之间注入。...脏检测基本原理是存储旧数值,并在进行检测时,把当前时刻和旧比对。若相等则没有变化,反之则检测到变化,需要更新视图。 angular2中有了Zone.js。...Angular双向绑定效率问题 对于页面中需要绑定DOM元素极其多情况(成百上千),必然会遇到效率问题。(具体还取决于PC、浏览器性能)。另外,脏检查超过10次(经验?)...pipe方式: 和绑定function类似,每次脏检测classPipe都会被调用。不过Angular给pipe做了优化,加了缓存,如果item和上次相等,则直接返回结果。...promise都会立即执行;而observables只是被创建,当调用(subscribe)时候才会被执行。 Promise返回一个;Observable返回0至N个

    4.3K20

    AngularDart4.0 英雄之旅-教程-07路由 顶

    分割AppComponent 当前应用程序加载AppComponent并立即显示英雄列表。 修改后应用程序应该提供一个可选视图(Dashboard和Heroes),然后默认为其中一个。...更新pubspec 使用Angular路由(angular_router)启用导航。 由于路由器自己包中,首先将该包添加到应用pubspec: ?...必须以大写字母开头以避免与路径混淆。 component(组件):此路由导航到(HeroesComponent)将被激活组件。 路由和导航页面阅读更多关于定义路由信息。...该列表包含两个元素:目标路由名称和设置为当前英雄id路由参数。...用户可以应用程序周围进行导航,从仪表板到英雄详细信息,然后返回,从英雄列表到英雄详细信息,再次回到英雄。 你已经达到推动这个页面的所有导航要求。 风格化应用程序 该应用程序是功能,但它需要样式。

    17.6K30

    前端程序员必知:单页面应用核心

    页面应用演进 接触到单页面应用时候,看起来就像是将所有的内容放在一个页面上么。 ?...并且同时不同前端框架上,他们在行为上还有一些区别。这取决于我们是否需要后台渲染,即刷新当前页面表现形式。 使用 Hash (#)或者 Hash Bang (#!) 形式。...后台返回是可变,它有可能不返回,有可能是 null,又或者是与我们要显示不一样——想要展示是 54%,而后台返回是 0.54。...组件交互:状态管理 用户从 A 页面跳转到 B 页面的时候,为了解耦组件间关系,我们不会使用组件参数来传入。而是将这些存储在内存里,适当时候调出这些。 ?...没有 Redux 之前,都会写一个 service 来管理应用状态。在这个模块里写上些 setter、getter 方法来存储状态,并根据业务功能写上一些来操作这个

    1.5K90
    领券