Repeater linked to Dynamic Page in Wix - repeater

Question

I am currently working on coding a search results page which is set up using a repeater so that the repeater container is able to redirect users to a Dynamic Page.
The datasets used on both the repeater and the dynamic pages are linked by the 'number' field in the relevant collections. So if the repeater is showing the detail for "1" in the number field then the user can click on the container box and be redirected to the dynamic page for "1". I have managed to get this working fine in that I am redirected to the correct Dynamic Page when I click on the relevant container. However, some numbers which exist in the dataset for the repeater don't exist in the dataset for the Dynamic Pages. So I could have numbers 1-50 in the dataset for the repeater but only 20 of those exist in the dataset for the dynamic pages and at the moment if the container contains a number that doesn't exist in the dynamic page, it still tries to redirect but just leads to a 404 error page where I would prefer it that, in this situation, the container is simply not clickable.
I have so far tried the following code:
$w('#Dataset1').onReady(() => {
wixData.query('Collection1')
.eq('number', number1)
.find()
.then(res => {
const number1 = res.number1;
})
.catch ((err) => {
let errorMsg = err;
});
wixData.query('Collection2')
.eq('number', number2)
.find()
.then(res => {
const number2 = res.number2;
})
.catch ( (err) => {
let errorMsg = err;
});
if (number1 === number2){
$w("#container2").onClick( (event) => {
let $item = $w.at(event.context);
let currentItem = $item('#Dataset1').getCurrentItem();
let dynamicPageID = `${currentItem.number}`
let collectionID = `${currentItem.title}`
console.log('https://www.mywebsite.com/'+collectionID+'/'+dynamicPageID);
wixLocation.to('https://www.mywebsite.comk/'+collectionID+'/'+dynamicPageID);
});
}
});
}
But this still redirects to dynamic pages where the number doesn't exist and sends to a 404 error!
Could anyone kindly point me in the right direction please?
Thanks
After Sam's suggestion regarding async/await, I have been playing around with the code but still failing to find a working solution. I have tried the below:
async function linktodynamicpage () {
$w('#Dataset1').onReady(() => {
wixData.query('Collection1')
.eq('number', number1)
.find()
.then(async(res) => {
const number1 = await res.number1;
})
.catch ((err) => {
let errorMsg = err;
});
wixData.query('Collection2')
.eq('number', number2)
.find()
.then(async(res) => {
const number2 = await res.number2;
})
.catch ( (err) => {
let errorMsg = err;
});
if (number1 === number2){
$w("#container2").onClick( (event) => {
let $item = $w.at(event.context);
let currentItem = $item('#Dataset1').getCurrentItem();
let dynamicPageID = `${currentItem.number}`
let collectionID = `${currentItem.title}`
console.log('https://www.mywebsite.com/'+collectionID+'/'+dynamicPageID);
wixLocation.to('https://www.mywebsite.comk/'+collectionID+'/'+dynamicPageID);
});
}
});
}
I have tried a few variations of this, trying to move the async about but to no avail unfortunately.
Just thought I would see if I am getting the async code right or if there are errors. That way, at least I know if the async/await option is a viable solution to my problem.
Thanks

Answer 1

My guess is that this has something to do with the Promises in your code. At the time you check if number1 is equal to number2 your queries have not resolved and they are therefore both undefined and always equal to each other.
To solve the problem, you can switch to using async/await syntax, or use Promise.all() to wait for both queries to resolve before doing the comparison.
The edit still doesn't wait for the queries to resolve. You need something more like this:
async function linktodynamicpage () {
$w('#Dataset1').onReady(async () => {
const number1 = await wixData.query('Collection1')
.eq('number', number1)
.find();
const number2 = await wixData.query('Collection2')
.eq('number', number2)
.find();
if (number1 === number2){
// the rest of the code...