Allow setting top-level options for IgniteUI components

[dkamburov]

It would be great if the following syntax is supported by IgniteUI components:

<ig-grid [(dataSource)]="ds" [height]="h" [width]="w"></ig-grid>

[dkamburov]

This is a feature, not a bug.

[Beachovic]

Hi,
in our opinion this is a must have feature because we would like to put UI layout stuff into the HTML where we think it belongs. If you specify all your options in the code you break the separation and basically don't need the HTML anymore.
Also I think the sample as it is now is incomplete because we would like to also have the column definitions and feature settings in HTML just like it was possible with the AngularJS wrapper for Ignite UI. So for example as the first AngularJS sample:
<ig-grid id="employees-grid" data-source="employees" primary-key="productID" auto-generate-columns="false"> <columns> <column key="employeeID" header-text="ID" width="65px" data-type="number"></column> <column key="lastName" header-text="Last Name" width="250px" data-type="string"></column> <column key="firstName" header-text="First Name" width="200px" data-type="string"></column> <column key="title" header-text="Title" data-type="string"></column> </columns> </ig-grid>

Do you plan to implement this feature because otherwise we will have to look for other solutions?
Thanks and best regards.

[kdinev]

The issue is for top-level options only, like in the example: width, height, dataSource, etc.
Complex options would not be supported initially for a number of reasons.

Example:

<columns>
    <column header-text=[some.prop] />
</columns>

This is an example of something we can't support and allowing hierarchical options to be defined through a directive makes it seem like a supported scenario.

[Beachovic]

Top level-options would be nice for controls like comboboxes but I think for the grid it wouldn't help much because most of the configuration is done on the sub levels. Why was this possible in Angular 1 and not now? Because the scope is now missing? Would it be possible to define the columns as child components? I'm struggling a lot with how to move my Angular 1 stuff to Angular 2 especially with your grid for which I modified your original wrapper.
For example I wanted button columns that were able to call a function in Angular and with your help was able to do this using $compile when the column was rendered. Now there is no $compile so I'm kind of stuck. Also as in your example setting the header text would be important to enable localization. Are you having the same troubles and maybe can help to solve them?

[kdinev]

The issue with a button column is pretty much the same in both Angular 1 and 2. Having hierarchical directives that represent configuration causes the developer to perceive these options as directives that each generate individual parts of the markup. With the controls this is not the case. Rendering is performed by the underlying widget according to the specified configuration options. Configuration is specific to the widget and not to the produced markup, so there is no direct correlation between options and markup. So what ends up happening is the same in both mine and your example: some two-way databinding capability is expected, but the widget does not understand this kind of configuration, which in most cases requires a simple workaround, but in some cases is very costly to implement.

Your suggestion is great: having child components for the hierarchical options is definitely a possibility. We will take a stab at this to see where we can get to with it, and we will update you on what the progress is.

[Beachovic]

Thanks for that. Do you also continue on the topic with the child elements like columns and features using child components?

[kdinev]

@Beachovic @dkamburov I still think this should be researched, but at the same time I would like to separate it from the top-level options issue. This issue is closed because the top-level ones are implemented now.

@dkamburov Do you want to take care of creating new issue for this one in order to research it?