问题标签 [angular-factory]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
48 浏览

angular8 - 如何在 Angular 8 的 ts 文件中包含工厂

我有这个工厂,它有 ngx-timpicker factory.ts,我想将它包含在我的 ts 文件中以在我的 time.ts 文件中使用工厂,但是我在 time.ts 文件中的导入行中遇到错误 -

如何在ts文件中导入工厂

工厂/timepickerconfig.factory.ts

时间.ts

0 投票
1 回答
439 浏览

angular - 将查询参数注入Angular中的依赖提供者工厂

我希望将window.location搜索参数中的值传递给依赖提供者工厂的主体,理想情况下以惯用的 Angular 方式。

用例:编写我的第一个 Angular 应用程序我的应用程序在一个端口上运行,后端服务器在另一个端口上。我想附加&backend=localhost:12345到 URL 以使应用程序与该主机对话。这是只读的,手写到 URL 栏。我不想导航到这样的 URL。

考虑的方法:

  1. 直接使用window.location.href。使代码依赖于浏览器,可能会破坏测试装置或任何其他想要在浏览器之外执行代码的东西。
  2. 使用PlatformLocation.href. 文档说“应用程序开发人员不应直接使用此类。”</li>
  3. 使用Location.path(). 似乎有效,但似乎也没有提供任何访问完整 URL 的方法。独立路径包含查询参数,但作为构造函数的参数似乎无效URL,所以我最终得到了类似new URL('http://no-such-host/' + location.path()).searchParams.get('backend'). 算不上优雅。
  4. 以某种方式使用ActivatedRoute.queryParams。将 anActivatedRoute注入我的工厂显然会给我一个默认实例(字符串化为Route(url:'', path:'')),因此查询参数似乎不存在。并且该queryParams方法返回一个Observable,而从我在网上阅读的内容来看,为提供者工厂使用异步代码流充其量是棘手的。

有没有更好的方法让工厂根据查询参数做出决策?

0 投票
0 回答
28 浏览

angularjs - 重复 xhr 请求 angularjs 工厂

我正在使用 Angular.Js 并使用工厂加载我的数据,我遇到了我的请求重复的问题。我正在注入另一个名为 filter 模块的模块。

我的搜索模块

过滤模块:

在此处输入图像描述

0 投票
1 回答
519 浏览

angular - Angular - 动态组件渲染错误数据

解决了

正如 Aaron 在下面提到的,“其他选项”方法没有问题并且感觉更干净。我将保留更新和所有内容,以防将来有人遇到类似问题,并且解决方法以某种方式提供有用。


我在尝试使用分页和排序在 Angular 材质表中渲染动态组件时遇到了一个奇怪的问题。

这是一个带有复制问题的Stackblitz 。根据我的研究,这似乎是某种变化检测问题,尽管我可能错了,因为我不知道为什么会发生这种情况。如果有人对如何解决此问题有任何想法,或者如果我做错了什么,我们将非常感谢您提供反馈和帮助。

当前行为:

我在材料设计表中使用@ViewChildrenComponentFactoryResolver来使用几页数据动态渲染组件。一切看起来都很好,但是当使用 matSort 对数据进行排序时,一些具有动态组件的行显示错误的数据值,而其余的行(非动态)具有正确的数据值。请参阅下面的屏幕截图:

排序前:

2

排序后:

3

组件实例的控制台日志(注意传递了正确的状态字段,但呈现了错误的状态字段)。

3

预期行为:

当我排序时,数据和渲染的组件会准确显示。应该匹配 dataSource.data 字段。

使用说明最小限度地再现问题:

访问Stackblitz并运行应用程序。单击“订单状态”的排序标题。请注意表中的第一个条目如何显示“已交付”,而实际数据源将其显示为“已取消”。也不是该行的其余部分是准确的 - 只是动态呈现的组件不正确。

我试过的:

  • 尝试使用 get() 和 set() 而不是 @Input() 设置状态并注册 ngOnChage,我在其中从组件本身调用 changeDetectorRef,但问题仍然存在。

  • 尝试更改 ChangeDetectionStrategy - 没有人做任何事情。

  • 也尝试了以下部分中的解决方案

在没有提到解决方案的情况下,我看过的可能的相关帖子

这似乎是同一个问题,但从未得到回答。我希望提供 Stackblitz 将有助于获得相同的答案。根据海报,这似乎是某种变化检测问题。

加载具有不同数据的相同组件时,仍然显示旧数据 - Angular 5

尝试显式调用 componentRefs 的 detectChanges() 和 markForCheck() chanceDetectionRef 方法,父组件是动态创建但没有运气的实际组件。

角度动态组件加载器更改检测问题

通过 ComponentFactoryResolver 创建组件时更改检测不起作用

可能的解决方法/更奇怪的行为:

如果您按订单状态排序并像以前一样在第一行中获取错误的值,然后分页到下一页并返回,组件显示正确的值。我假设分页强制在材料表或模板中进行某种更改检测,或类似的东西,但我不知道为什么排序不会这样做。目前我要做的工作是分页到下一页并返回,但这绝不是一个可接受的解决方案,我真的很想了解我在这里做错了什么,或者对此有什么解决方法是。

更新 1

根据下面 Aaron 的其他见解,我添加了一个更新的 Stackblitz,其中包含一个更加简化的示例。仔细观察,分页似乎并没有成为奇怪行为的一个因素。我只需 2 个表格条目和一个排序(所有分页代码都已删除)即可重现该问题。我已经更改了传入的数据以匹配各行,因此更清楚哪些行来自哪里。

这是使用 2、3 和 4 记录排序前后的组合屏幕截图:

在此处输入图像描述

我目前正在尝试查看是否可以强制表格重新渲染(假设它可能会改变事情),并最终会挖掘表格的源代码。

更新 2

我能够想出的一种解决方法是在执行过滤逻辑之前将我的 dataSource 的副本保存为右侧的副本后,将其设置为空数组splice()onSortChange()然后将其设置回过滤后的数组。我假设这会触发材质数据源/表中的某种更新,从而强制重新渲染或更新。我会继续尝试找出是否有更好的方法来解决这个问题,因为这样做似乎很奇怪,而且在我的原始应用程序中,我有一个 filterPredicate ,它在过滤/重置过滤器时也会导致同样的问题。

更新 3

Aaaaaand 最后在对此进行了更多研究之后,我至少找到了一个有意义的解决方案。在我在更新 #2 上说完之后,我发现了这篇文章:

https://github.com/angular/components/issues/15972#issuecomment-490235603

这就解释了为什么表没有得到更新的数据源。就我而言,由于我正在进行排序/过滤,因此可能很难弄清楚这一点,并且认为它不会直接与此相关。在接下来的几天里,我仍然会探索更多的想法,但如果两者都不起作用,我会在此之后将其标记为已解决。

0 投票
1 回答
44 浏览

javascript - 如何使用工厂函数返回 $http.post() 对象?

当我尝试使用 Angular 从工厂函数返回 $http.post() 对象时,它会抛出这个错误:

在此处输入图像描述

下面是我的代码:

AngularUtils.js

管理员.js

如何正确返回 $http.post() 对象?