Show / Hide Table of Contents
Fork me on GitHub

Binding in Depth

Basic features

  • All CLR types are supported by Neutronium: String, char, int, uint, short, ushort, long, ulong, double, decimal, float, byte and sbyte (both in upcoming v1.0.0) are transformed in their javascript equivalent.

  • C# DateTime type is mapped to javascript dateTime.

  • Enum are transformed to custom javascript objects containing two properties: intValue and displayName. intValue is the numeric value of the enum, displayName is the value of the Description attribute if any or the object.ToString() value.

  • C# collections such as IEnumerable, IList are converted to javascript arrays.

  • C# dictionaries with string key are converted to javascript objects (from version >= 1.0.0).

  • Dynamic Objects (from version >= 1.0.0):

    • ExpandoObject objects are converted to javascript objects allowing two-way binding including updating and adding keys.

    • Objects inheriting from DynamicObject are converted to javascript objects using properties returned by GetDynamicMemberNames

  • Complex objects are mapped to javascript using reflection on public attributes.

Binding support

  • Tracking of property changes is done via INotifyPropertyChanged interface. This way changes in the ViewModel are reflected in the HTML View.

  • Tracking of collection changes is supported listening INotifyCollectionChanged interface. This way, any collection implementing this interface will be updated in the view when changing. This provides native integration with ObservableCollection.

  • Changes in HTML View are propagated to ViewModel using Knockout.js subscription or Vue.js watch (both property and collection). This allows you for example to have a collection binding to the selected items in the HTML view that will bind to your ViewModel collection.

  • ICommand, ISimpleCommand, ICommandWithoutParemeter, IResultCommand and their generic versions are converted to javascript function so you can execute them using knockout or Vue.

    See Vue and Knockout.js binding section for details.

  • BindableAttribute support (from version >= 1.0.0)

    Neutronium uses BindableAttribute information when creating bindings. Property marked as bindable false will not be visible from javascript:

    [Bindable(false)]
    public string InvisibleFromNeutroniumBinding {get; set;}

Property marked as read-only will not be updatable from javascript:

    [Bindable(true, BindingDirection.OneWay)]
    public string NotSettableFromNeutroniumBinding {get; set;}

It is possible to use BindableAttribute attribute at class level, this way all properties of the class will default with the corresponding attribute value. That value can be overloaded by attribute at property level:

[Bindable(false)]
public class ViewModel
{
    // Invisible as inherited from class attribute
    public string InvisibleFromNeutroniumBinding {get; set;}

    [Bindable(true, BindingDirection.TwoWay)]
    public string SettableFromNeutroniumBinding {get; set;}
}

Complex viewModel supported

  • Nested ViewModel fully supported

  • One to one object mapping (that is if you have a same object referenced n times in your C# ViewModel, it will be mapped only one time and reference n times in the javascript session).

Limitations

By design only public property are mapped during binding. So it may be a good idea to use internal for property that have no effect on the view, as it may improve binding performance.

Fields independent from their accessibility are not mapped.

Full working examples are provided in the Neutronium examples folder. See projects:

  • Example.ChromiumFX.Vue.UI
  • Example.ChromiumFX.Ko.UI
  • Example.CefGlue.Ko.SelectedItems
  • Example.ChromiumFX.Vue.Collection
  • Improve this Doc
Back to top Generated by DocFX