I am still quite new to angular and perhaps I have the wrong end of the stick in my design here but I am trying to create a re-usable widget, a dropdown menu (html select).
This dropdown menu will contain a list of options.
What I would like to do is create a generic dropdown widget that can have its contents added at runtime by specifying the dependencies when the module is run.
In the dependency list of the module i would like to define what factory to use to then fill the html select with options
currently what I have is:
angular.module('web_dropDown', ['optionsFactory'])
is it possible for me to define "optionsFactory" on the fly so that the same module can be used to create dropdown menus with different contents?
Related
So right now I'm trying to build this radio list for the regions in LWC, the functionality works fine in that when you click on the regions it selects all the states below for that region.
https://i.stack.imgur.com/y2MM8.png
However, I want to stylize it so that it looks more proper. I'm a little confused how to do this using these components that LWC provides. Here's a mockup of what the regions should look like.
https://i.stack.imgur.com/A26PH.png
Here's what the HTML for it looks like.
https://i.stack.imgur.com/1vWcy.png
You can probably achieve this by using the grid system : https://www.lightningdesignsystem.com/utilities/grid/
We can achieve the same style by following a couple of steps:
Pass class to each lightning inputs to scope the styling.
Style radio controls having the passed class name.
save the file as .css and store in static resources.
Load style sheet in component by making use of loadStyle method from platformResourceLoader module.
Im trying to create a form, first element should be a tag with a few options and each of them will dynamically bring up a different set of forms depending on what the user chooses. The idea is within the select tag there will be different categories like cars, properties etc.. first user only sees that and when chose, it will bring up a set of input fields that required for that category.
Anyone got an idea what would be the best way to do it in angular?
Using the ui.router module, you can populate a DOM element (ui-view) with an HTML template file. On selection of the dropdown, you're telling angular to go to a different "state".
Check out the following plunkr I made: http://plnkr.co/edit/jnKQOvkE4nJinEQ5zhr6?p=preview
I'm trying to create a 2 level tab navigation with each sub-tab has dynamic UI content. I'm trying to have the whole UI created from JSON definition with main TABs array where each tab contain sub-tabs array. Each sub-tab contain UI elements such as text, combobox, radio button, multi-select list, etc...
I'm looking at this tab example and trying to combine it with dynamic content for the inner tab. Since I am new to angularjs I just hope to get some help to get me started.
http://plnkr.co/edit/QSvqd3hSqa8BUYU9eKaO?p=preview
You may want to consider Metawidget for AngularJS, as it does much of the hard work around "creating a UI from JSON definition" for you. Here's a tutorial that creates a UI using JSON schema: http://metawidget.org/doc/reference/en/html/ch01s02.html
(This is how my module definition looks like.)
I am using DNN 6 and I have module with following user controls. Now when I add the module to be added on page it always show the View.ascx; so how can I show pagestarter.ascx?
My goal is I have page A and it should show VIew.ascx and I have page B that should show PageStarter.ascx.
To do this you have three options.
Add a second module definition and add the second control to that as the item with no key. This will make it so everytime you add the module to a page both are added. You can then just delete the one you don't want.
Create the other as a separate module which will give a second item to add
Control the loading yourself within the main ascx that is registered by dynamically loading your desired control.
I'd like to be able to generate a component from within a template. The use case for it is that when I generate a row in a DataView I'd like to be able to incorporate buttons and/or other components (maybe even a nested grid) to the rendered items.
So far everywhere I look all I see is a template calling another template. Is there a way to do what I'd like (generate component instead of just plain html) from an XTemplate?
Since an XTemplate is just used for generating markup to be inserted into the DOM, it alone is not enough to create components -- Components do have an underlying DOM element (through component.el.dom), but also exist as JavaScript objects in browser memory with other methods and properties.
It is possible to accomplish what you are asking through several different ways... you can use the XTemplate to generate the markup, and use the Component.applyTo config option to create a Component object in memory that is linked to the DOM element from your template. Of course, you will have to wait until the template is applied and then create a component with applyTo set to the correct DOM element.
You could also extend the XTemplate class to do the same thing just mentioned, but wrapped up in the applyTemplate stuff. I am pretty sure that Ext does not have a built-in way for the templates to create components -- so far they just create HTML.