How to identify the observed target in the callback.

[rkaule]

Hi, I have a group of dynamic elements that I load on a page. Each of them is contained in an IntersectionObserve where I specify the options and the callback. It is working perfectly. However when I am in the callback function I have no way of determining which of the elements the callback is from (other than the bounding box from the entry). Am I missing something? I need to call a C# function from the callback and I need to know which of the elements it is for.

Thanks, Bob

[ljbc1994]

Hi @rkaule

Could you use some sort of identifier to achieve this in the loop - for example something like:

@foreach (var image in Images)
{
    <IntersectionObserve Once=@true>
       <div class="example" @ref="context.Ref.Current" OnChange="@(entry => OnIntersectingChanged(image.Id, entry))">
    </IntersectionObserve>
}

@functions {
    public void OnIntersectingChanged(string id, IntersectionObserverEntry entry)
    {

    }
}

[rkaule]

Hi Louie, Thanks for the reply. I can try this. While I was waiting I downloaded the source. I added Target : String to the IntersectionObserverEntry class, then in the index.ts I added Target = entry.target.id ( This may not be exactly what I did, I don't have the code in front of me right now, but I think you know where I'm talking about.). I got this to work, but trying to get the nugget package compiled correctly was a pain. I use Rider on a Mac. I will try your suggestion this coming week and let you know.

Thanks, Bob

[rkaule]

Hi Louie,

Your suggestion worked.

Thanks,

Robert Kaule President

Essential System, Inc 7703 Perry Hwy, Pittsburgh, PA 15237

@.*** office: 412 931-5403 x402 iPhone: 412 335-9003

On Dec 25, 2021, at 2:53 PM, Louie Colgan @.***> wrote:

Hi @rkaule https://github.com/rkaule Could you use some sort of identifier to achieve this in the loop - for example something like:

@foreach (var image in Images) { <IntersectionObserve @.***> <div class="example" @ref="context.Ref.Current" OnChange="@(entry => OnIntersectingChanged(image.Id, entry))"> }

@functions { public void OnIntersectingChanged(string id, IntersectionObserverEntry entry) {

}

} — Reply to this email directly, view it on GitHub https://github.com/ljbc1994/BlazorIntersectionObserver/issues/39#issuecomment-1001066647, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABSTKQLE7X4EGH7ST6S74BDUSYOKDANCNFSM5KS5LXGQ. Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub. You are receiving this because you were mentioned.