I have a React component named ItemList which loads a list of items from an API server and then renders them as a list of Item components.
Each Item has a delete button. When the button is clicked, I want to send a request to the API server to delete the item, then re-render the ItemList.
One way I can think of to make that work is to move both API queries into reducers, and then dispatch actions whenever …
我有一个包含一堆输入字段的表,有点像电子表格.一些输入字段使用jQuery UI datepicker.还有一个用于添加表格行的按钮.
当我单击按钮添加表格行时,它会正确添加到DOM中.但是,datepicker小部件不会附加到该新行中的日期字段.
我怀疑答案是使用live() - 或者也许on() - 来调用datepicker(),但我不明白使用什么语法.下面的代码已经推动了我对jQuery理解的限制.我头疼.救命?
<script type="text/javascript">
$(function() {
$( ".usedatepicker" ).datepicker();
});
$('.rowadd').live('click',function(){
var appendTxt = '<tr><td><input class="usedatepicker" name="something" type="text" /></td></tr>';
$("tr:last").after(appendTxt);
});
</script>
Run Code Online (Sandbox Code Playgroud)
注2:我也试过这个,有live()和on().它似乎适用于原始字段和动态插入的字段,但偶尔(至少在Chrome中).比如,它会工作三秒钟然后停止三秒钟,然后工作三秒钟......
$(function() {
$('.usedatepicker').live('click', function(){
$(this).datepicker({showOn:'focus'});
});
});
Run Code Online (Sandbox Code Playgroud) 在Angular中,这是在尝试关闭可观察的订阅之前是否检查它是否有效的有效方法?它似乎产生正确的行为。也就是说,它仅关闭打开的订阅。我想知道的是,在Angular中是否还有其他“正确”的方式来做到这一点。
import { Component, OnUpdate, OnDestroy } from '@angular/core';
import { AngularFirestore } from 'angularfire2/firestore';
import { VoteService } from '../../services/vote.service';
export class Foo implements OnUpdate, OnDestroy {
private voteSubscription;
constructor(private afs: AngularFirestore,public voteService: VoteService) {}
ngOnUpdate() {
/* Lots of complicated things happen here which result in voteSubscription
being opened and closed based on external conditions including but not
limited to auth state. Bottom line is that sometimes the subscription
is active and sometimes it's not. */
if ( …Run Code Online (Sandbox Code Playgroud) 在 Laravel 中,可以指定在主作业成功执行后应按顺序运行的排队作业列表。如果序列中的一项作业失败,则其余作业将不会运行。Laravel 文档显示,这是通过在可分派作业上使用 withChain 方法来完成的,如下例所示:
ProcessPodcast::withChain([
new OptimizePodcast,
new ReleasePodcast
])->dispatch();
Run Code Online (Sandbox Code Playgroud)
这在 Laravel 中对我来说效果很好,但是我使用的是 Lumen(Laravel 的轻量级子集)。
根据Lumen 关于队列的文档,“与框架的许多其他部分一样,Lumen 的排队作业的功能与 Laravel 的排队作业相同。因此,要了解有关 Lumen 中排队作业的更多信息,请查看完整的 Laravel 队列文档。”
Lumen 文档确实提到了与 Laravel 的一些细微差别,包括将作业分派到队列的方式的差异。它解释了 Lumen 中的作业可以使用调度函数或队列外观来调度:
dispatch(new ExampleJob);
Queue::push(new ExampleJob);
Run Code Online (Sandbox Code Playgroud)
以此为背景,Lumen有没有办法调度连锁作业呢?我已经在谷歌上搜索了几天,与我的问题最接近的匹配是这两个链接:
$this->dispatch( (new FillBruteFec($import))->chain(new FillRaiFec()) );对我来说也不起作用。上面的 Stack Overflow 链接解释了 Laravel 语法不起作用的原因是 Lumen 缺少这个Illuminate\Foundation\Bus\Dispatchable特性。
更复杂的事情是,我需要向每个作业传递一组不同的参数 -即使在完整的 Laravel 框架中,这显然也具有挑战性。
以下是我目前在 Lumen 应用程序中提交作业的方式(无链接):
Queue::push(new CreateUser($username,$password));
Queue::push(new SetForwarding($username,$forwardTo));
Queue::push(new EnableIncomingEmail($username));
Queue::push(new …Run Code Online (Sandbox Code Playgroud) 我看过一些教程,展示了在 Angular 中实现可观察量的多种不同方法。对于我的目的来说,其中许多似乎过于复杂。其他的是以前的版本,不再工作。
假设我有一个具有名为 的单个属性的服务numChickens,并且我希望允许组件订阅该属性。Do.i.really((need)=> to.chain((a)=>{million.garbledyGook().statements.to('gether)}) 才能实现这一点吗?
这是相关服务的代码:
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root'
})
export class ChickenService {
public chickens: number;
constructor() { }
}
Run Code Online (Sandbox Code Playgroud)
...这是将使用可观察对象的组件的代码:
import { Component, OnInit } from '@angular/core';
import { ChickenService } from '../chicken.service';
@Component({
selector: 'app-chickendisplay',
templateUrl: './chickendisplay.component.html',
styleUrls: ['./chickendisplay.component.scss']
})
export class ChickenDisplayComponent implements OnInit {
constructor(public cs: ChickenService) {
}
ngOnInit() {
}
}
Run Code Online (Sandbox Code Playgroud)
在 Angular 6 中,在 ChickenService 中公开属性以便组件类能够以可观察流的形式访问该属性的值的最简单、最直接、最易读的方法是什么?chickens或者组件模板可以使用异步管道显示值?
我怎么强调都不为过——拜托,不要在答案中包含 8,192 …
我已经编写了一些代码,允许用户以类似于 Reddit 的方式对食谱投赞成票/反对票。
每个单独的投票都存储在名为 的 Firestore 集合中votes,其结构如下:
{username,recipeId,value} (其中值为 -1 或 1)
食谱存储在recipes集合中,其结构有点像这样:
{title,username,ingredients,instructions,score}
每次用户对某个菜谱进行投票时,我都需要将他们的投票记录在投票集合中,并更新该菜谱的得分。我想使用事务将其作为原子操作来执行,因此这两个值不可能不同步。
以下是我到目前为止的代码。我正在使用 Angular 6,但是我找不到任何显示如何在单个事务中处理多个 get() 的 Typescript 示例,因此我最终调整了我发现的一些基于 Promise 的 JavaScript 代码。
该代码似乎有效,但发生了一些令人担忧的事情。当我快速连续单击 upvote/downvote 按钮时,偶尔会出现一些控制台错误。这些读POST https://firestore.googleapis.com/v1beta1/projects/myprojectname/databases/(default)/documents:commit 400 ()。当我查看来自服务器的实际响应时,我看到:
{
"error": {
"code": 400,
"message": "the stored version (1534122723779132) does not match the required base version (0)",
"status": "FAILED_PRECONDITION"
}
}
Run Code Online (Sandbox Code Playgroud)
请注意,当我缓慢单击按钮时不会出现错误。
我应该担心这个错误,还是只是事务重试的正常结果? 如 Firestore 文档中所述,“如果并发编辑影响事务读取的文档,则调用事务的函数(事务函数)可能会运行多次。”
请注意,我已尝试将 try/catch 块包装在下面的每个操作周围,并且没有抛出任何错误。为了使代码更容易理解,我在发布之前删除了它们。
非常有兴趣听取任何改进我的代码的建议,无论它们是否与 HTTP 400 错误有关。
async vote(username, recipeId, direction) {
let value;
if …Run Code Online (Sandbox Code Playgroud) 在Angular 6/Typescript代码示例中,我看到使用以下两种语法调用胖箭头函数.它们之间是否存在一些差异,或者它们在功能上是否相同?
blah.then(param => {
// do something with param
});
blah.then((param) => {
// do something with param
});
Run Code Online (Sandbox Code Playgroud) 有人可以说明Angular 6 / rxjs 6中take(1)的语法吗?
在下面的代码中,我从Firestore检索文档,然后将其作为可观察的文档使用。
然后,我订阅该可观察的内容,阅读文档的时间戳,并以人类可读的格式设置年龄。效果很好,但是不必每次文档流中都有更改时都执行。它只需要执行一次,因为文档时间戳永远不会改变。
我如何修改此代码以合并take(1),以便年龄字符串仅生成一次,并且订阅items未保持打开状态?我take(1)在Angular / rxjs版本6下找不到任何清晰的语法示例。我可以找到的所有示例都是针对先前版本的。
import { Component, Input, OnChanges } from '@angular/core';
import { AngularFirestore, AngularFirestoreDocument } from 'angularfire2/firestore';
import { Item } from '../../interfaces/item';
@Component({
selector: 'app-item',
templateUrl: './item.component.html',
styleUrls: ['./item.component.scss']
})
export class ItemComponent implements OnChanges {
@Input() itemId: string;
private itemDoc: AngularFirestoreDocument<Item>;
public item: Observable<Item>;
public age: string;
constructor(private afs: AngularFirestore) {}
ngOnChanges() {
if ( this.itemId ) {
this.itemDoc = this.afs.doc<Item>('items/' + this.itemId);
this.item …Run Code Online (Sandbox Code Playgroud) angular ×4
typescript ×3
jquery ×1
jquery-ui ×1
laravel ×1
lumen ×1
promise ×1
react-redux ×1
reactjs ×1
rxjs ×1
rxjs6 ×1
transactions ×1