the template for component is not done correctly
Closed this issue · 5 comments
styles are toasted.... but can be fixed .....
Luiz Américo i see you responded to the last entry post..grate.... your still active...
Try and use this component as a programmer calling card....to build networking clients
here is what i mean..... you built a component and programmers get clients and they need help....
Add your account here ....... and set up your freelancer links correctly on github front page.....
https://www.freelancer.com/jobs/coding/
Now you get to services projects that need your help......
then you can also add other profile links that help you build and service it.......
networking......
if you need help post your project here or for a one one......
when look at your guithub site you look at dates logs..... your last date is 12 months ago
basically you edit samples and help ....... your run time code dates can be old it shows your stable...
it takes years to get users to support the component.....
I ran a test tinybind vs knockout...... you won 500 ms +
all try and fix it at my end......
class App extends tinybind.Component
static get template <---ok
static get tagname <----add
static get styles<----add
constructor() {
super(); <----not need its done at create tinybind.Component
customElements.define('my-app', App);<----not need its done at create tinybind.Component
the the tagname is the component not the template you created in create tinybind.Component
Shadow DOM allows hidden DOM trees to be attached to elements in the regular DOM tree — this shadow DOM tree starts with a shadow root, underneath which can be attached to any elements you want, in the same way as the normal DOM.
its not template tag its the one i send to tinybind.Component
Load an and unload
let shadow = elementRef.attachShadow mode: 'open'
let shadow = elementRef.attachShadow mode: 'closed
var style = document.createElement('style');
style.textContent = "i send you styls"
var myDiv = document.createElement('DIV');
myDiv.innerHTML = "the template i sent you"
shadow.appendChild style;
shadow.appendChild myDiv ;
customElements.define 'my-app.tag', your-Template-class);
I simply extend its features and inject what you need....
code is all done..... we now have isolated dom and styles in tinybind.Component
and i can create more the one also...... by doing it over and over because tinbind lets you already
tinybind.bind(document.getElementById("test1"), model);
tinybind.bind(document.getElementById("test2"), model);
tinybind.bind(document.getElementById("test3"), model);
class Message extends tinybind.Component
static get template()
return <div>Hello {message}</div> =======
Alll done please fix lol..... the constructor() needs to be at my end.. not sure but it should work
and tinybind become a component only
no more calls like this
tinybind.bind(document.getElementById("test3"), model);
no more function needed its by done in the constructor by Tag id calls from javasript to the component
this can be strip out later
nope did not work...... tinybind is not setup to run a shadow dom...... i tried
in the component you used doument.cerateElement 'template'
Dom ignores it.... so styles wont work........
but it should work like this
class myApp extends HTMLElement
constructor()
super();
// Create a shadow root
var shadow = this.attachShadow({mode: 'open'});
its using HTMLElement
not App extends tinybind.Component
i can now create the shadow root
====== the solution is like this=====
tinybind.bind(shadow.element, model);
i can now isolate tinybind in the container from the element the old way....
then inject template and styles to.....
class myApp extends HTMLElement
components are tricky to big they fail.......when you attach to mush junk code to it
with shadow dom everything is isolated and naming
this.modal = []
tinybind.bind(shadow.element, model.tables.item.list);
it only sent part of the model
your not a component your a algorithms lib to a component i create.....
anyway..... my allotted time is done till fall ... i have personal work to do
feel free to close this as i network entry with you.... or i will close it.... my time is my time and respect your time. with your response.. i cant do more till fall. winter ..it takes time and focus to build and test..
feel free to respond i just cant test code build nothing now... its summer
try not too do all or the user is lost in you dogma code... a lib is not a component but a component needs a lib..
when i respond its endless ... it test code and respond live to you get logs to what i test
logs did you do do the time no i did so its logged to you ... these are my problem i keep recording to you feel free to jump in.... i record steps to you its not a chat its that i log in step as i code and test to you.. its not spam its step recorded i cant wait for you i'm running a test logs to you
we close test logs... long winded rants ... debug .... we see what is not yet is.. logs its not my way o n way you learn by the debugger logs... i so i rant what to you logs i and if you respond you redirect the logs i created... debug logs calked inputs on my tine dime not you..you get slush logs to re define the entry .slush logs ranters.. test log steps...
Thanks. The component is pretty simple but does the job.
come fall all run more test....
i did do tinybind vs tinybind.component <--it ran mush slower
and had problems with styles... where tinybind.bind to a div did not
it has to do with doument.cerateElement 'template'
an unregistered tag name + you created the element not dom
with class myApp extends HTMLElement
you now created the custom tag to dom with instructions.
whats nice about this is i can use JavaScript to manipulate the new element
doument.createElement ''my-new-tag'
I dont need to register a function to tinybind
i use the html tag id.myfunction() created in the class
the class holds reference to a tinybind view
Its just a lib of algorithms this way.......
var my = doument.createElement ''my-new-tag'
my.loadfunction( a, b c) <<<<<function before append
document.appendchild (my)
i just load data into the new element and ran a filter....
tinybind is a lib for speed binding and indexing calls to avoid loops
its something you can mull over for summer......