Its Very easy To Use.
let invoice = {
    invoice_no: 'abc',
    date: '',
    party: {
        id: 1,
        name: 'qwetry',
    },
    transactions: [
        {
            id:null,
            type: 1,
            quantity: 0
        },
        {
            id:null,
            type: 1,
            quantity: 0
        },
    ]
}

The attribute is,
    1. NsModelBind="objectName.properties".

how to use,
    1. <input type="number" min="0" name="invoice_no" id="invoice_no" NsModelBind="invoice.invoice_no" value="0" class="form-control"/>
        in here the mandatory part is NsModelBind="invoice.invoice_no"'
    2. <input type="number" min="0" name="quantity" id="quantity" NsModelBind="invoice.transactions[0].quantity" value="0" class="form-control"/>
        For nasted Relation data.
For date,
    1. <input type="text" data-serial="1" data-type="date" id="date" name="date" NsModelBind="invoice.date" class="form-control date-picker cl-form-control" value="{{ date('d-m-Y') }}"/>
        in here the mandatory parts are NsModelBind="invoice.date",  data-serial="1" data-type="date"
    2. if have multiple date in same window than need to maintain data-serial="1" attr, According to the order of those date sequentially. 
    Example-
        <input type="text" data-serial="1" data-type="date" id="date" name="date" NsModelBind="invoice.date" class="form-control date-picker cl-form-control" value="{{ date('d-m-Y') }}"/>
        <input type="text" data-serial="2" data-type="date" id="date" name="date" NsModelBind="invoice.date1" class="form-control date-picker cl-form-control" value="{{ date('d-m-Y') }}"/>
        <input type="text" data-serial="3" data-type="date" id="date" name="date" NsModelBind="invoice.date2" class="form-control date-picker cl-form-control" value="{{ date('d-m-Y') }}"/>
For fraction
        <input type="number" data-fraction="2" id="price" name="price" NsModelBind="invoice.price" class="form-control cl-form-control"/>
this is to handle number type field independently. if all the fields needs the same than just set it globally through globalVarsObject.viewSetter.fractionDigit = 2 this variable.

THe best part is, it'll work automatically in html append with js with NsModelBind attribute. no need to initialize anything.

Now About viewSetter(), this need to set object data to view.
its semi automated, u need to call viewSetter(object, objectVarName) this function where object = your object and objectVarName = your defined object variable name.

For Setting View From Object.
    viewSetter(invoice, 'invoice');
    need to call like this.
 
OR you can just assign this to a global variable named globalVarsObject.
Example-
globalVarsObject.viewSetter = {
    object: invoice,
    definedObjectName: 'invoice',
    skipObjectInViewSetter: ['party'],
    fractionDigit: 2
};

in here skipObjectInViewSetter is an array where u can add the variable which data will not need to set.
in invoice object we don't need the party variable to set in frontend. that's why for optimization we can simple skip that like this.
thought if we don't use skipObjectInViewSetter, it will not affect anything except performance.



Note: Any suggestion will help to improve this even more.