Is there a way to combine Razor (CSHTML) with Polymer elements? Or is it mandatory that a Polymer element should be HTML to be imported?
Thanks in advance!
You should be able to combine any template engine by either:
Compiling custom templates to produce HTML output
Using Polymer's built-in event callbacks/creating custom elements to dynamically compile custom template code to HTML at runtime with a client-side compiler
So, generally speaking, using Polymer shouldn't prevent you in finding a way to use your template engine as you have previously with your other client-side applications.
Related
Is there a way I can make Polymer WebComponents and LitElements coexist?
It should be doable in theory, but afaik you cannot import html in LitElements, so it is actually infeasible.
This issue try to address the problem https://github.com/Polymer/lit-element/issues/48
Is there a way to use importHref in LitElement?
You cannot import HTML into anything but another Polymer 2/HTML element. If you are dealing with Polymer 2 elements from Google--paper-input, iron-dropdown, etc.--use npm to install their Polymer 3.0 version. If your HTML elements are from another source, you will have to rewrite them. I was able to use polymer-modulizer to convert some simple elements to JavaScript, but it was not up to a more complex element (15 components and 5 mix-ins). (Even those that did convert I ended up rewriting to LitElement.)
I'm using Polymer components with ClojureScript + Reframe (actually, at the moment, I have just one Polymer component working). My component is mostly stateless (a drawing tool for Dicom images), so it plays nicely with Reframe. I use HTML + callbacks to communicate with it. It works nicely, but I'm not using ClojureScript advanced compilation. I haven't used advanced compilation before and have some questions about its use:
As I understand, Polymer isn't compatible with Google Closure. Is that still the case?
If I'm using just HTML/callbacks to talk to the component, do I still have problems with name mangling? I suppose that I am safe with the HTML part, but am I going to have problems with the callbacks? Such as [component-x {... :on-mouse-down (dispatch-canvas-event editor-id)}]
What happens to the javascript portion of the WebComponent during compilation? Does it get changed, even if I don't call any function directly (just HTML/callbacks)?
If I do have to call a function in a component, any examples of how to write an Extern file for a Polymer component?
Is there a way to make part of markup ignored during Angular2 compilation? The issue is i have additional library that uses jQuery and <template> tags and because of Angular the <template> html tags are not present in DOM when the library tries to reach it with $('template') selector.
A workaround is to inject needed HTML markup after containing container init. So i've made simple $('container')[0].innerHtml = 'markup with <template></template>' in one of my angular2 components in ngOnInit method.
All the guides about Angular2 propose to have a separate file for css styling for each component. As I get is so far, for each custom directive there is the need to make requests to the server to get the html and css for that directive (component). If this is the case, what is the performance impact for the page when multiple requests are made for multiple directives? Is there any other recommended way?
That's only true during development. A build step (currently work in progress) will inline resources and generate code for declarative bindings. In the end there will be only a minimum number of requests.
Some related issues:
https://github.com/angular/angular/issues/8717
https://github.com/angular/angular/issues/8550
https://github.com/angular/angular/issues/8759
https://github.com/angular/angular/pull/8097
https://github.com/angular/angular/issues/6612#issuecomment-175894674
https://github.com/angular/angular/pull/8400
From my understanding the browser rendering process is essentially happening in the following steps:
HTML is parsed into DOM tree
DOM tree is converted to a render tree
Layout
Paint
Where does Angular JS come in the picture here? For example if I have an expression like
<div>{{test}}</div>
or
<div ng-include="..."></div>
Is it right to think that Angular does the interpolation or HTML injection, and then the browser takes the resulting HTML code, and goes through steps 1-4?
Angular JS documentation says:
When Angular starts your application, it parses and processes this
new markup from the template using the compiler. The loaded,
transformed and rendered DOM is basically the view
Here a template means:
HTML code that contains Angular specific attributes.
For more information on how AngularJs works and what it can do, please read the documentation provided:
https://docs.angularjs.org/guide/concepts
There is an in-depth tutorial which provide more information on it.
I hope this could help you get started with it :)