问题标签 [html-templates]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
html - 是否可以以编程方式在 Web 组件中插入元素?
是否可以自动或以编程方式插入嵌套的 Web 组件或特定类型的元素,而无需指定slot
它们的属性?
考虑一些这样的结构:
有了<parent-element>
这样的 Shadow DOM:
预期结果是:
换句话说,我想强制<child-element>
s 只允许在<parent-element>
类似于<td>
元素内只允许在一个<tr>
元素内。我希望它们被放置在<slot name="child-elements">
元素中。必须为它们中的每一个指定一个slot
属性以将它们放置在特定的插槽中<parent-element>
似乎是多余的。同时,<parent-element>
应该自动将其余内容插入到第二个<slot>
元素中。
我首先搜索了一种在注册父元素时定义它的方法,尽管CustomElementRegistry.define()
目前仅支持extends
作为选项。
然后我想,也许有一个功能允许手动插入元素,即类似的东西childElement.slot('child-elements')
,但似乎不存在。
然后我尝试在父元素的构造函数中以编程方式实现这一点,如下所示:
虽然这不会将子元素移动到<slot name="child-elements">
,但它们仍然会被插入到第二个<slot>
元素中。
python - 登录视图Django中没有反向匹配,html模板解析错误
我的 django 应用程序有问题。我的 base.html 模板可以在某些视图中解析,但不能在所有视图中解析并返回错误代码
我对 django 没有太多经验,但它似乎可以在视图彼此相距不太远时解析模板。
我的结构也很糟糕,但我不知道如何正确构建 django 网站。
登录文件(不起作用):
仪表板文件(作品):
模板的文件结构:templates/base html templates/registration/login html templates/users/dashboard html
urls python 文件
base.html 中的问题行:
这只是 html 模板中带有 static 的第一行。[文件结构][1]
完整代码在这里: https ://github.com/lolThinked/Stemdirekte
下面的错误代码:'''
''' [1]: https://i.stack.imgur.com/f9H0E.png
javascript - 如何使用/链接外部api在grapejs组件中显示获取的数据
我是grape和backbonejs的新手。我想制作一个模板构建器,除了具有grapejs提供的默认组件(如标签、图像等)外,还将具有ex-top 5产品的自定义组件,其中包含图像和产品名称以及它将从服务器获取最新数据。在这种情况下,我无法弄清楚应该在哪里进行 API 调用以及如何使用获取的结果在组件中显示。我尝试过的代码的链接在评论中。
javascript - 如何在葡萄组件的模型或视图中获取葡萄编辑器实例
我正在使用grapejs 作为模板构建器,我想在组件的模型或视图中访问grapejs 编辑器实例。当我将它作为道具传递给组件时,同时将其添加到块管理器错误:“将循环结构转换为 JSON ”由 js 引擎引发。
任何人都可以请指导我。
web-component - 为什么使用的时候需要用到cloneNode with Shadow Dom
I've been looking around the mdn documents about web component,I followed the link and i arrived to documents about template below the link is what i was looking.
According to the d
I've been looking around the mdn documents about web component,I followed the link and i arrived to documents about template below the link is what i was looking.
According to the documents
it says if i don't append node by using cloneNode? template's inner style will does not work. But i try both just append and append with cloneNode but both test was same.... So i have a question that am i miss understanding or spec changes to support both? i test both browser in chrome , safari
code with out cloneNode
code using cloneNode
https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_templates_and_slots
Moving a div inside a container from edge to edge
I'm trying to make a div (shapped like a bar) move inside of a container (infinite loop, back and forth).
You can find the codepen here: https://codepen.io/riza-khan/pen/wvzLRPW?editors=0010
I just can't seem to find the correct method to do so.
I used getBoundingClientRect()
to get the position of the parent element and tried to tie the position of the bar to its parents left and right values, but that doesn't seem to work. It bobbles back and forth in the middle of nowhere.
Basically the intended results are that the bar moves from one edge to the other edge of its container element (but never leaves the container).
Thank you,
I've been looking around the mdn documents about web component,I followed the link and i arrived to documents about template below the link is what i was looking.
According to the d
I've been looking around the mdn documents about web component,I followed the link and i arrived to documents about template below the link is what i was looking.
According to the documents
it says if i don't append node by using cloneNode? template's inner style will does not work. But i try both just append and append with cloneNode but both test was same.... So i have a question that am i miss understanding or spec changes to support both? i test both browser in chrome , safari
code with out cloneNode
code using cloneNode
https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_templates_and_slots
Moving a div inside a container from edge to edge
I'm trying to make a div (shapped like a bar) move inside of a container (infinite loop, back and forth).
You can find the codepen here: https://codepen.io/riza-khan/pen/wvzLRPW?editors=0010
I just can't seem to find the correct method to do so.
I used getBoundingClientRect()
to get the position of the parent element and tried to tie the position of the bar to its parents left and right values, but that doesn't seem to work. It bobbles back and forth in the middle of nowhere.
Basically the intended results are that the bar moves from one edge to the other edge of its container element (but never leaves the container).
Thank you,
I've been looking around the mdn documents about web component,I followed the link and i arrived to documents about template below the link is what i was looking.
According to the documents
it says if i don't append node by using cloneNode? template's inner style will does not work. But i try both just append and append with cloneNode but both test was same.... So i have a question that am i miss understanding or spec changes to support both? i test both browser in chrome , safari
code with out cloneNode
code using cloneNode
https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_templates_and_slots
I'm trying to make a div (shapped like a bar) move inside of a container (infinite loop, back and forth).
You can find the codepen here: https://codepen.io/riza-khan/pen/wvzLRPW?editors=0010
I just can't seem to find the correct method to do so.
I used getBoundingClientRect()
to get the position of the parent element and tried to tie the position of the bar to its parents left and right values, but that doesn't seem to work. It bobbles back and forth in the middle of nowhere.
Basically the intended results are that the bar moves from one edge to the other edge of its container element (but never leaves the container).
Thank you,
html - 如果href链接无效,如何防止Outlook在电子邮件中将href链接显示为纯文本?
我的电子邮件模板中有电子邮件链接:
即使我的电子邮件是有效的,因为这是我被要求做的,这些链接在 Outlook 上不能很好地显示,而不是有一个标签“电子邮件”可点击”,我在 Outlook Web 应用程序上有这样的东西:(我猜即使在网络版本和移动版本中也是如此)
[email@email.email]电子邮件
真实例子:
href 在 Outlook 上显示为纯文本
每个链接都必须包含 https 或 http 才能在 Outlook 上正确显示?
谢谢你的帮助!
html - 为什么thunderbird会移动html header的样式?
我正在创建响应式电子邮件模板,我使用 Thunderbird 发送一些测试。
在大多数电子邮件客户端中,它运行良好。但是在 Gmail 中,这些样式并未应用。
检查 CSS 支持我发现 gmail 只支持 <head> 标签内的 <style> 。邮件黑猩猩
知道了这一点,我将我的样式植入了头部,但是,这些样式并没有应用到 GMAIL 中。
在研究了各种论坛并打破了我的头后,我找不到解决方案,所以我检查了很明显,原来Thunderbird 将 <style> 从 <head> 移动到 <body>
当我通过 Thunderbird 发送模板并查看邮件来源时,我得到以下信息:
当我通过 mailutils 发送模板时,行为符合预期,并且样式在 gmail 中正常工作
gmail的视图:
如何防止雷鸟将样式移动到身体?
我正在使用 Thunderbird 78.7.1、Ubuntu 20.04.2 LTS
javascript - 从 Web 组件继承时如何填充插槽?
假设我有一个对话框组件,例如
现在假设我想创建专用对话框……例如,允许用户选择图像的对话框。
我可以这样做
但我不喜欢show
andhide
方法,那里。
另一种选择是从对话框继承而不是从HTMLElement
...
但如果我这样做,我该如何填补空缺?
天真的方法当然是使用_shadow
并将其放入插槽的内部 html 中,但我有一种感觉,这不是要走的路。
javascript - 如何在一个 Webpack“应用程序”的不同 HTML 模板中使用 Google Material Design (MDC) 组件?
我正在做一个我需要学习 Webpack 的项目,所以我仍然是它的初学者,目前正在努力连接这些点。
以下挑战:在我的应用程序中,有多个 html 模板 - 用户可以从 index.html 导航到不同的子页面。例如,用户可以从contact.html转到contactform.html通过
现在我们在不同的模板中使用不同的 mdc 组件(https://material.io/develop/web/getting-started)。例如,在 index.html 中有一些可以正常工作的文本字段,如下例所示:
应用程序.scss:
应用程序.js:
现在,当我尝试在 contactform.html 中添加我们需要的 MDC 菜单时,我遇到了问题,我需要尝试以下操作:
联系表格.js:
但是:在附加的contactform.js 中执行此操作,在导航到contactform.html 时调用它会抛出: SyntaxError: Unexpected token '{'。import call 只需要一个参数。
不知何故,只能在 app.js 中导入 @material 组件,在 app.scss 中导入 @use。如果我尝试在 app.js 中初始化菜单,那么 #testmenu 当然不存在,因为它是“稍后”模板的一部分。
如何正确地将 MDC 组件导入不同的模板并在需要时对其进行初始化?感觉就像我错过了一些非常基本的东西。如果需要,我也可以提供我的 webpack 文件。
c# - 在 C# 中为电子邮件模板实现对象匹配
我正在开发一个 html 模板来向用户发送电子邮件。该模板可以包含不同大小的图像,并且每封电子邮件的图像都可以不同。我们希望将每个图像都调整到合适的120px X 90px
大小,但是由于 Outlook 不支持诸如此类的 css 属性object-fit
,并且由于固定的高度属性,它使图像看起来要么被拉伸(小图像)要么被压扁(大图像)。如果去掉 height 属性,会影响整体设计。
有人可以建议object-fit:contain
在 c# 中实现 css 属性以使图像适合120px X 90px
(4:3 比例)或使用 Outlook css 属性吗?
示例: https ://www.w3schools.com/css/tryit.asp?filename=trycss3_object-fit_all
提前致谢!
PS:我正在使用 C# razor 引擎来生成电子邮件。
更新 #1:Outook 黑客/解决方案没有帮助。有人可以建议如何剪裁 base64 编码的图像以保持其纵横比(4:3),同时适合图像帧(120px X 90px
)?