Ad
Angular-datepicker: Get Ng-model Value Into Scope
I'm new to AngularJs and I want to show the selected date and time of my datepicker in a <pre>
tag by the scope of the ng-model="abc"
.
angular-datepicker (github), angular-datepicker (demo)
Html:
<div class="container">
<div class="row">
<div class="col-md-4">
<div ng-controller="foo">
<input type="datetime" class="form-control" date-time ng-model="myDate" format="dd-MM-yyyy HH:MM" placeholder="Select datetime">
<pre>myDate: {{myDate}}</pre>
</div>
</div>
</div>
</div>
JS:
angular.module('demo', ['datePicker']).controller('foo', ['$scope', function($scope) {
//empty
}]);
Here is a plnkr
Ad
Answer
Here's the updated plnkr - http://plnkr.co/edit/Qagb78UDqXQrabcZucr6.
To get it working, I had to make ng-model
point to an object.property (myDate.value
) in the input
. And you can get the model value in the template like this:
<pre>
myDate: {{myDate.value | date: "dd-MM-yyyy HH:MM"}}
</pre>
Controller:
$scope.myDate = {
value: ''
};
Hope this answers your question. Here's the reason why ng-model
need to have a dot - Does my ng-model really need to have a dot to avoid child $scope problems?.
Ad
source: stackoverflow.com
Related Questions
- → How to update data attribute on Ajax complete
- → October CMS - Radio Button Ajax Click Twice in a Row Causes Content to disappear
- → Octobercms Component Unique id (Twig & Javascript)
- → Passing a JS var from AJAX response to Twig
- → Laravel {!! Form::open() !!} doesn't work within AngularJS
- → DropzoneJS & Laravel - Output form validation errors
- → Import statement and Babel
- → Uncaught TypeError: Cannot read property '__SECRET_DOM_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' of undefined
- → React-router: Passing props to children
- → ListView.DataSource looping data for React Native
- → Can't test submit handler in React component
- → React + Flux - How to avoid global variable
- → Webpack, React & Babel, not rendering DOM
Ad