NanoGallery2如何获取图片id

Question

我正在使用 NanoGallery2 库，我想获取图像 ID，但我不知道如何获取它。我的代码：

<div id="ng2" data-nanogallery2>
  @foreach ($photos as $photo)
    <a id="{{ $photo->id }}" href="{{ asset('uploads/'.$photo->path) }}" data-ngThumb="{{ asset('uploads/'.$photo->path) }}"> {{ $photo->image_name }} </a>
  @endforeach
</div>

@foreach 来自 BladeLaravel。

Here，在 API 文档中，有 itemSelected 事件，但我只能使用 "title"，比如图像名称。

如果我这样做：

$("#ng2").on( 'itemSelected.nanogallery2', writePhotoName );
function writePhotoName(e){
   items = $("#ng2").nanogallery2('itemsSelectedGet');
   console.log(items);
}

结果： image

嗯.. 谢谢

Answer 1

使用GetID()检索项目（图片或相册）ID

item.GetID();

或：

items[n].GetID();

[编辑]

对于您的用例，您有 2 种可能性：
- 使用属性 data-ngid 设置内部 ID

<div id="ng2" data-nanogallery2>
  @foreach ($photos as $photo)
    <a data-ngid="{{ $photo->id }}" href="{{ asset('uploads/'.$photo->path) }}" data-ngThumb="{{ asset('uploads/'.$photo->path) }}"> {{ $photo->image_name }} </a>
  @endforeach
</div>

并检索 ID：items[n].GetID()
- 或者使用属性 data-ngcustomData 来存储自定义数据：

<div id="ng2" data-nanogallery2>
  @foreach ($photos as $photo)
    <a data-ngcustomData='{ "myID"="{{ $photo->id }}" }' href="{{ asset('uploads/'.$photo->path) }}" data-ngThumb="{{ asset('uploads/'.$photo->path) }}"> {{ $photo->image_name }} </a>
  @endforeach
</div>

并检索 ID：items[n].customData.myID

参见 codenpen

上的示例

NanoGallery2如何获取图片id

NanoGallery2 how to get the image id

javascript

jquery

nanogallery