- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
我有一个页面,我在其中显示了一个包含位置
的列表,然后单击每个列表我将显示该位置
的 Assets
。我已经设置了这样的模板:
<li
*ngFor="let location of locations"
(click)="select(location)"
droppable
[dragOverClass]="'drag-target-border'"
(onDrop)="onItemDrop($event, location)"
>
{{ location.name }}
<ul *ngIf="currentLocation == location && assetsVisible">
<ng-container *ngIf="currentLocation.assets?.length > 0;else message">
<li
*ngFor="let asset of currentLocation.assets"
class="asset"
draggable
[dragData]="asset"
>
<p>{{ asset.title }}</p>
<p>{{ asset.address }}</p>
<p>{{ asset.value }}</p>
</li>
</ng-container>
<ng-template #message>No assets for {{ location.name }}</ng-template>
</ul>
</li>
在组件中,我设置了空的 assets
数组和一个空的 currentLocation
:
locations: any[] = [];
currentLocation: any = {};
assets: any[] = [];
然后在 select
方法中,我像这样获取 Assets :
select(location:any = {){
if (this.currentLocation != location || !this.assetsVisible) {
this.assetsVisible = true;
}
else {
this.assetsVisible = false;
}
this.currentAddress = address;
this.locationService.getAssets(location.Id)
.subscribe(
assets => this.assets = assets
);
}
我想做的是因为我正在使用 the drag and drop plugin for Angular我想让用户可以将 Assets 从一个位置拖到另一个位置。然后暂时将该 Assets 推送到数组 assets
。我为此做了一个函数:
onItemDrop(e: any, location:any = {}) {
this.assets = [];
this.assets.push(e.dragData);
this.select(location);
}
因此,当用户将 Assets 从一个位置拖放到另一个位置时,我将清空 assets
数组,并将被拖动的新 Assets 推送到该数组。但是,然后在 select
方法中,我得到了 asset
被删除的那个新 location
的所有 assets
到,然后重写 assets
数组。我怎样才能将那些 assets
推送到同一个数组,以便我同时添加新的 asset
和那个 location 的
我从服务端点得到的?我也尝试了另一种方法,我首先清空数组 Assets ,然后调用并将新的 assets
location
和新的 asset
传递给 select
方法:
onItemDrop(e: any, location:any = {}) {
this.assets = [];
this.select(location, e.dragData);
}
然后,在 select
方法中,我将 asset
参数设置为可选,然后将其推送到 assets
数组我从服务中获取了该位置
的所有 Assets
:
select(location:any = {}, asset?:any = {}) {
this.locationService.getAssets(location.Id)
.subscribe(
assets => this.assets = assets,
if (asset) {this.assets.push(asset)}
);
}
但是,这没有用,放置到新位置的 Assets 没有显示在模板中。我怎样才能做到这一点?
最佳答案
在您的第一种方法中,您将覆盖 subscribe
函数中的 assets
数组:
this.locationService.getAssets(location.Id).subscribe(
assets => this.assets = assets
);
很明显,您临时保存在该数组中的 asset
此时丢失了。
你的第二种方法更有意义,但你在这个例子中使用的 subscribe
是错误的:
this.locationService.getAssets(location.Id).subscribe(
assets => this.assets = assets,
if (asset) {this.assets.push(asset)}
);
在这种情况下,if (asset) ...
部分作为第二个参数传递给您的 subscribe
调用,即 错误回调
。你想这样做:
this.locationService.getAssets(location.Id).subscribe( (assets) => {
this.assets = assets;
if (asset) {
this.assets.push(asset)
}
});
希望对您有所帮助。
更新:我什至不确定那个 if (asset) ...
部分,你实现它的方式,是否甚至作为错误回调工作。如果调用该回调,您可能会在那里遇到错误,因为需要一个函数,而不是一个表达式(但正如我所说,我不确定)。
关于javascript - Angular 4 - 将新项目从可观察对象推送到数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44451988/
我的一位教授给了我们一些考试练习题,其中一个问题类似于下面(伪代码): a.setColor(blue); b.setColor(red); a = b; b.setColor(purple); b
我似乎经常使用这个测试 if( object && object !== "null" && object !== "undefined" ){ doSomething(); } 在对象上,我
C# Object/object 是值类型还是引用类型? 我检查过它们可以保留引用,但是这个引用不能用于更改对象。 using System; class MyClass { public s
我在通过 AJAX 发送 json 时遇到问题。 var data = [{"name": "Will", "surname": "Smith", "age": "40"},{"name": "Wil
当我尝试访问我的 View 中的对象 {{result}} 时(我从 Express js 服务器发送该对象),它只显示 [object][object]有谁知道如何获取 JSON 格式的值吗? 这是
我有不同类型的数据(可能是字符串、整数......)。这是一个简单的例子: public static void main(String[] args) { before("one"); }
嗨,我是 json 和 javascript 的新手。 我在这个网站找到了使用json数据作为表格的方法。 我很好奇为什么当我尝试使用 json 数据作为表时,我得到 [Object,Object]
已关闭。此问题需要 debugging details 。目前不接受答案。 编辑问题以包含 desired behavior, a specific problem or error, and the
我听别人说 null == object 比 object == null check 例如: void m1(Object obj ) { if(null == obj) // Is thi
Match 对象 提供了对正则表达式匹配的只读属性的访问。 说明 Match 对象只能通过 RegExp 对象的 Execute 方法来创建,该方法实际上返回了 Match 对象的集合。所有的
Class 对象 使用 Class 语句创建的对象。提供了对类的各种事件的访问。 说明 不允许显式地将一个变量声明为 Class 类型。在 VBScript 的上下文中,“类对象”一词指的是用
Folder 对象 提供对文件夹所有属性的访问。 说明 以下代码举例说明如何获得 Folder 对象并查看它的属性: Function ShowDateCreated(f
File 对象 提供对文件的所有属性的访问。 说明 以下代码举例说明如何获得一个 File 对象并查看它的属性: Function ShowDateCreated(fil
Drive 对象 提供对磁盘驱动器或网络共享的属性的访问。 说明 以下代码举例说明如何使用 Drive 对象访问驱动器的属性: Function ShowFreeSpac
FileSystemObject 对象 提供对计算机文件系统的访问。 说明 以下代码举例说明如何使用 FileSystemObject 对象返回一个 TextStream 对象,此对象可以被读
我是 javascript OOP 的新手,我认为这是一个相对基本的问题,但我无法通过搜索网络找到任何帮助。我是否遗漏了什么,或者我只是以错误的方式解决了这个问题? 这是我的示例代码: functio
我可以很容易地创造出很多不同的对象。例如像这样: var myObject = { myFunction: function () { return ""; } };
function Person(fname, lname) { this.fname = fname, this.lname = lname, this.getName = function()
任何人都可以向我解释为什么下面的代码给出 (object, Object) 吗? (console.log(dope) 给出了它应该的内容,但在 JSON.stringify 和 JSON.parse
我正在尝试完成散点图 exercise来自免费代码营。然而,我现在只自己学习了 d3 几个小时,在遵循 lynda.com 的教程后,我一直在尝试确定如何在工具提示中显示特定数据。 This code
我是一名优秀的程序员,十分优秀!