AngularJs input[type=date] not showing value on load

问题

I'm hoping you can help as I'm fairly new to AngularJs. I have created an edit form template that displays 3 fields; a name, a start date and an end date. The data is coming from a WebAPI controller written in C# with an entity framework data source.

When the form loads the input for the start data and for the end date are blank.

All of this is part of an extension to the Umbraco7 back end.

How can I get my date inputs to populate and keep the data binding to my model?

This is my form:

            </div>
            <div class="span5">
                <div class="btn-toolbar pull-right umb-btn-toolbar">
                    <umb-options-menu ng-show="currentNode"
                                      current-node="currentNode"
                                      current-section="{{currentSection}}">
                    </umb-options-menu>
                </div>
            </div>
        </umb-header>
        <div class="umb-panel-body umb-scrollable row-fluid">
            <div class="tab-content form-horizontal" style="padding-bottom: 90px">
                <div class="umb-pane">
                    <umb-control-group label="Start Date" description="The date the event starts">    
                        <input type="text" class="umb-editor umb-textstring" ng-model="event.StartDate" required/>
                    </umb-control-group>
                    <umb-control-group label="End date" description="The date the event finishes">
                        <input type="date" class="umb-editor umb-textstring" ng-model="event.EndDate" required/>
                    </umb-control-group>
                    <div class="umb-tab-buttons" detect-fold>
                        <div class="btn-group">
                            <button type="submit" data-hotkey="ctrl+s" class="btn btn-success">
                                <localize key="buttons_save">Save</localize>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </umb-panel>
</form>

I've checked that when the event comes in that all the fields are populated by examining the console, I've also tried just having the input as text and the values show.

In the code above I've left the start date as a text input which is populating, but the end date isn't

Yet if I set them and click save the model in the background updates.

Any help would be appreciated.

回答1:

Umbraco 7.2.4 (the most recent release until today) uses Angular 1.1.5
Angular ng-model binding does not work with input[type="date"] until version 1.3
take a look at this SO question for more details.

So you may want to consider upgrading to angular 1.3, not sure if it won't break anything in Umbraco though. Or just stick to input[type="text"]

HTH

来源：https://stackoverflow.com/questions/30193338/angularjs-inputtype-date-not-showing-value-on-load

标签

jquery

angularjs

date

umbraco7