問題タブ [html5-template]
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.
javascript - インポートされた css フォント/アイコンがシャドウ DOM の要素に影響を与えるにはどうすればよいですか?
Shadow DOM を使用してカスタム要素を作成したいとします。テンプレート内の一部の要素には、リンクされた css ファイルで指定されたクラス名があります。ここで、css ルールが要素に影響を与えるようにしたいと考えています。しかし、シャドウ DOM スタイルの境界のため、それを達成することはできません。
fa-search
font-awesome css ファイルでクラスが定義されていますが、要素のスタイルを設定するにはどうすればよいです<i>
か?
html - での outerHTML の動作
Given this <template>
:
<template id="my-template">
<h1 id="h">Hello!</h1>
</template>
And JS:
var t = document.q
Given this <template>
:
And JS:
It's interesting that it works in FireFox and Edge but in Chrome outerHTML
requires a parent element, otherwise it throws error in console (https://chromium.googlesource.com/chromium/blink/+/master/Source/core/dom/Element.cpp#2528):
See https://jsfiddle.net/q5fmn186/11/
My question is, is Chrome behavior the correct one? Should setting outerHTML
not work in <template>
on direct children? Why aren't the other web-browser treat it like an error?
I agree with Käsebrot you should separate your html coding from your css, and open style.css file and connect it to your html page in the 'head' section link rel="stylesheet" href="style.css"
and then give your canvas css properties.
To center the canvas you only need the give values to the margin and display attributes.
Given this <template>
:
<template id="my-template">
<h1 id="h">Hello!</h1>
</template>
And JS:
var t = document.q
Given this <template>
:
And JS:
It's interesting that it works in FireFox and Edge but in Chrome outerHTML
requires a parent element, otherwise it throws error in console (https://chromium.googlesource.com/chromium/blink/+/master/Source/core/dom/Element.cpp#2528):
See https://jsfiddle.net/q5fmn186/11/
My question is, is Chrome behavior the correct one? Should setting outerHTML
not work in <template>
on direct children? Why aren't the other web-browser treat it like an error?
I agree with Käsebrot you should separate your html coding from your css, and open style.css file and connect it to your html page in the 'head' section link rel="stylesheet" href="style.css"
and then give your canvas css properties.
To center the canvas you only need the give values to the margin and display attributes.
angular - angular2で紙のデータテーブルを使用する
angular 2 アプリケーションでpaper-data-table ( David Mulder による paper data table )を使用することについて、私はしばらく静かに苦労してきました。
私が直面している問題は、データ テーブルの問題で説明されています: angular 2 アプリケーションでのテーブルの使用に関して開かれた問題
基本的に、ドキュメント化されていないポリマーの dataHost プロパティが使用されており、angular2 で使用すると誤った値が取得されます。私はいくつかの解決策を試しましたが、それらのいずれも完全に機能させることはできません: 1) テーブルをラップするポリマー要素を作成する方法を見つけようとしました。要素の (有効な子として) 削除し、そこから削除して、要素のローカル dom に再度追加します。dataHostの問題は同じままでした。David 自身が過去にこの問題を報告したことさえわかりました (したがって、David のコードが失敗するのと同じ理由で、私の解決策は機能しないと思います) データホスト 2) 私が質問の最初に投稿した問題ページで、David は . これは新しい理由で機能しませんでした。この dom-bind の内容は dom にさえ配置されていませんでした。これは、angular2 がテンプレート タグを「独自の方法」で読み取ってコメントするという事実に関連付けることができると思います。それらに意味のあるものが何もない場合 (たとえば [ngIf] 属性など)。
解決策1または2、または別の解決策のいずれかで助けていただければ幸いです(Angular 2で機能する可能性のある完全な機能を備えたマテリアルデザインテーブルが見つからなかったので、そのオプションを認識していないものがある場合も)
助けてくれてありがとう!:)
- - - - - - - - - - アップデート - - - - - - - - - - - - - - -
私がこれまでに試したことのいくつかのコード例:
テーブルラッパーを実装しようとした方法は次のとおりです。
また、テーブルを使用するコードが一部のコンポーネントに含まれていることも重要です。コンポーネントでは、データ プロパティをパブリック プロパティとして定義しているため、テーブル データにデータ バインドできます (常に内部で使用する必要があります)。コンポーネントであり、常にコンポーネントからパラメーターとデータを渡す必要があります。これは、ソリューションでも機能するバインディングを使用する代わりの方法がある場合に限ります。