在我的SvelteKit应用程序中，一些页面是英语(en)和一些页面是波斯语(fa)。app.html文件为整个应用程序静态地设置lang属性为en。如何使lang属性是动态的，并根据页面的语言为不同的页面设置不同的值?
我试图在app.html文件中使用lang={lang}将lang属性绑定到动态值，但这不起作用，因为变量不能在app.html文件中使用，就像它们可以在.svelte文件中使用一样。
您可以在handle钩子的帮助下使lang属性动态，如The "lang" attribute部分文档中所述:
<!-- src/app.html -->
<html lang="%lang%">
// src/hooks.server.js
export function handle({ event, resolve }) {
return resolve(event, {
transformPageChunk: ({ html }) => html.replace('%lang%', get_lang(event))
});
}
服务器钩子是你正在寻找的，你可以检查你是否在一个英语或波斯语页面从钩子事件对象。假设你使用的是TypeScript，这大概就是src/hooks.server.ts文件的样子。
export const handle = (async ({ event, resolve }) => {
let lang = event.url.startsWith('/fa') ? 'fa' : 'en';
return resolve(event, {
transformPageChunk: ({ html }) => html.replace('%lang%', lang)
});
}) satisfies Handle;这是在HTML中注入值的推荐方式，通常是Svelte无法访问的。在SvelteKit的官方版本中有一个封闭的问题。