异步管道不适用于主题

2024-01-12

我的服务中有以下BehaviorSubject:

  isAuthenticated = new BehaviorSubject<boolean>(false);

我在组件中按如下方式使用它:

  authenticated: Observable<boolean>;

  constructor(private accountService: AccountService) { }

  ngOnInit() {
    this.authenticated = this.accountService.isAuthenticated.asObservable();
  }

在模板中我做了类似的事情:

  <li class="login-button" *ngIf="!authenticated | async">
    <a (click)="authenticate()">Log in</a>
  </li>
  <li *ngIf="authenticated | async">
    <a>Logged in</a>
  </li>

问题是我没有看到两者中的任何一个li,尽管假设第一个应该出现,因为我将主题的初始值分配为 false。

我究竟做错了什么?


我怀疑它的操作顺序 - 你的订阅需要括号:

<li class="login-button" *ngIf="!(authenticated | async)">
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

异步管道不适用于主题 的相关文章

  • 加载带有数据的 PROMISE 后的 Angular 2 渲染模板

    我是 AngularJS 2 0 的新手 基本上我是通过构造函数中的 Promise 加载数据 但模板是在 Promise 解析之前渲染的 知道如何实现这一目标吗 谢谢 M 您可以测试data在使用它之前 ul li item value
  • Angular - 通用服务的提供者

    我已经为我的 HTTP API 创建了一个通用服务 并且我想为不同的端点提供此服务 而无需为每个端点创建一个类 我的服务看起来像这样 export class ApiService
  • 使用 Angular2 中的服务在组件之间共享数据

    我正在使用 angular2 开发一个应用程序 我有一个场景 我需要在路由 使用 router navigate 时将复杂数据 对象数组 从一个组件传递到另一个组件 它们不是父子组件 它们是两个独立的组件 我用谷歌搜索了这个 大多数结果描述
  • 如何让 Angular 2 选择动态添加的 routerLink 指令

    正如所见这个笨蛋 https plnkr co edit K906Y8KtkgYVgAIsCLqE p preview 我动态地将 HTML 添加到我的一个元素中 这可以归结为 Component selector my comp temp
  • 在 Angular 2 Typescript 应用程序中使用 moment.js

    我在 Angular 2 Typescript 应用程序中使用 moment js 库时遇到了困难 即使在阅读了答案之后这个问题 https stackoverflow com q 35166168 1031097我无法让它工作 这就是我到
  • Angular 4 触发自定义事件 - EventEmitter 与dispatchEvent()

    我正在构建指令 该指令应该在元素进入视口时添加类 并且还将触发自定义事件 我找到了两种触发事件的方法 EventEmitterand dispatchEvent 两者都工作正常 在这种情况下应该使用哪个 为什么 对代码的任何其他建议表示赞赏
  • 绑定到元素(div)的大小

    我有一个具有宽度和高度属性的组件 如何将组件的视图高度和宽度绑定到这些属性 我需要在组件大小发生变化时更新它们 即通过重新调整浏览器窗口的大小 Use window resize onResize event 聆听全球事件 您可以使用win
  • AngularCLI 和 Angular Material(原理图)错误:无法解析集合“@angular/material”

    我正在尝试使用显示的 Angular 架构这一页 https material angular io guide schematics当我尝试在项目根目录的终端中使用以下命令时ng 生成 angular material material
  • TemplateRef 中未定义 ElementRef

    在 Angular 中试验 ElementRef TemplateRef ViewRef 和 ViewContainerRef 我已经创建了一个 HTML 模板 我想从那里创建一个视图并将该视图传递给 ViewContainerRef 但它
  • Angular6 材料垫选择列表中当前选择的值

    使用角度材质2垫选择列表 能够判断当前选项是选中还是未选中 Boolean 组件 html
  • 如何将 Observables 数组与 RxJS 6.x 和 Node.js 合并?

    出于学习目的 我正在创建一个 Node 应用程序 该应用程序需要从数组中获取 x RxJS 可观察值并将其组合成单个事件流 我想知道事件何时以任何可观察的方式 以任何顺序发生 不是以任何顺序或完全完成 我觉得它应该在一个合并的事件流中 基本
  • Angular 4 Http POST 不起作用

    我希望每个人都做得很好 我最近开始使用 Angular 4 4 我一直在尝试将数据发布到我的 api 服务器 但不幸的是它不起作用 我花了大约两天的时间 但仍然没有成功 甚至已经尝试过 6 7 篇文章角 io https angular i
  • Angular 4 中的箭头函数(Lambda 函数)

    我对lambda知之甚少 lambda表达式被视为一个函数 我们有很多方法可以做到这一点 这是我的简单功能TypeScript file byPan card1 card2 return card1 pan card2 pan 我在 HTM
  • Angular,从动态创建的组件中获取ViewChild / ViewContainerRef

    有没有办法从动态创建的组件中获取 ViewContainerRef 我的动态创建的组件内部有一个 ngContent 元素 我想在动态创建后填充该元素 export class Example ViewChild content read
  • 如何将查询参数添加到守卫中的路由并将其传递给 Angular 4 中的组件?

    我在我的 Angular 4 应用程序中使用路由保护 如果条件满足并返回 true 我想向路由添加一个查询参数 这是我一直在研究的代码 Injectable export class ViewGuardService implements
  • Angular 2发送数组另一页

    我正在使用 Angular 开发天气应用程序 我是 Angular 的新手 我想带上我选择的城市的天气信息 但我无法将数据发送到第二页 哪里有问题 预先感谢您的帮助 export class ForecastComponent implem
  • 具有多个 Angular 2 应用程序的 ASP.Net Core MVC [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我正在尝试为一个我知道会变得越来越复杂的项目准备结构 我想使用 ASP Net Core MVC 进行顶层导航 我想在每个主视图中放置
  • 拖动事件未以角度 2 触发

    我有一个画布 我希望用户能够在其周围拖动图形元素 因此 我不希望画布本身拖动 但我想在鼠标执行这些操作时处理 Dragstart 拖放事件 我正在使用 Angular 2 所以我有 div div 然后在 editor component
  • 角度材质自动完成力选择

    在我的 Angular 5 应用程序中 我有一些 matAutocomplete 但我想强制选择其中一个建议 所以我遵循这种方法 堆栈闪电战 https stackblitz com edit autocomplete force sele
  • 如何在全局配置文件中配置 ngx-logger 的记录器级别

    我最近包括了ngx logger对于我在应用程序中实现记录器级别的项目 我已将记录器级别硬编码为app module ts在配置内ngx logger但我需要在一些全局配置文件中实现这一点 我遵循了教程here https medium c

随机推荐