search

g00fy- / angular-datepicker

calendar and datepicker directives for angular
MIT License
719 stars 420 forks source link

ng-model value sync #306

Closed sihuiIE closed 8 years ago

sihuiIE commented 8 years ago

How can i get the model value? How to sync two model?

<html>
    <head>
        <title>sample</title>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="apple-touch-icon" href="apple-touch-icon.png">
    </head>

    <body id="body" ng-app="sample">
        <form  class="test-unit" ng-controller="form">
            <input type="text" ng-model="native">
            <input type="datetime" date-time date-change="changeDate" ng-model="demo" min-view="date" max-view="date" auto-close="true" view="date" maxlength="10" placeholder="Set Date" format="DD/MM/YYYY">
        </form>

        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"></script>
        <script src="https://rawgit.com/g00fy-/angular-datepicker/master/dist/angular-datepicker.min.js"></script>
        <script>
        var demoApp = angular.module('sample', ['datePicker']);

        demoApp.controller('form', function($scope) {
            $scope.changeDate= function(value){
                console.log($scope); // how to get the value and pass it to native 
                $scope.native = 'wer'
            }
        });
        </script>
    </body>
</html>
sihuiIE commented 8 years ago

sorted

<html>
    <head>
        <title>sample</title>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="apple-touch-icon" href="apple-touch-icon.png">
    </head>

    <body id="body" ng-app="sample">
        <form  class="test-unit" ng-controller="form">
            <input type="text" ng-model="form.native">
            <input type="datetime" date-time date-change="changeDate" ng-model="form.demo" min-view="date" max-view="date" auto-close="true" view="date" maxlength="10" placeholder="Set Date" format="DD/MM/YYYY">
        </form>

        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"></script>
        <script src="https://rawgit.com/g00fy-/angular-datepicker/master/dist/angular-datepicker.min.js"></script>
        <script>
        var demoApp = angular.module('sample', ['datePicker']);

        demoApp.controller('form', function($scope) {
            $scope.form ={};
            $scope.changeDate= function(){
                var value = $scope.form.demo._d,
                    date = value.getDate(),
                    year = value.getFullYear(),
                    month = value.getMonth() + 1;

                    day = date + '/' + month + '/' +year;

                $scope.form.native = day;
            }
        });
        </script>
    </body>
</html>