Question

我正在使用angular-bootstrap-datepicker并需要动态转换日期格式以用于US＆＃34; mm / dd / yy＆＃34;或英国＆＃34; dd / mm / yy＆＃34;。但是，在更新ng-options后，单击任何日期时英国的弹出日历行为不正确。

我创建了一个jsFiddle，我们将不胜感激。

＆＃13;

    <build>
        <plugins>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-antrun-plugin</artifactId>
                <version>1.8</version>
                <executions>
                    <execution>
                        <id>build</id>
                        <phase>compile</phase>
                        <goals>
                            <goal>run</goal>
                        </goals>
                        <configuration>
                            <target>
                                <echo>run chmod in ${basedir}</echo>
                                <chmod file="${project.basedir}/filepattern.txt" perm="ugo+rx"/>
                            </target>
                        </configuration>
                    </execution>
                </executions>
            </plugin>

＆＃13;

app = angular.module('demo', ['ng-bootstrap-datepicker']);
app.controller('AppCtrl', function($scope) {
    $scope.datepickerOptions = {
        format: 'mm/dd/yy',
        language: 'en',
        autoclose: true
    }
    $scope.format= "US";
    
    $scope.ukFormat = function (){   	
    //setTimeout(function () {
    //    $scope.$apply(function () {
        $scope.datepickerOptions = {
            format: 'dd/mm/yy',
        } 
   //     });
   // }, 3000);        
        $scope.format = 'UK';
    }

    $scope.usFormat = function (){
    	$scope.datepickerOptions = {
        	format: 'mm/dd/yy',
    	}
        $scope.format = 'US';
    }
});

＆＃13;

由于

Answer 1

以下是JSFiddle，我使用此gist向datepicker添加刷新事件，因此只需添加新模块：

angular.module('ui.bootstrap.datepicker')
    .config(function($provide) {
        $provide.decorator('datepickerDirective', function($delegate) {
            var directive = $delegate[0];
            var link = directive.link;

            directive.compile = function() {
                return function(scope, element, attrs, ctrls) {
                    link.apply(this, arguments);

                    var datepickerCtrl = ctrls[0];
                    var ngModelCtrl = ctrls[1];

                    if (ngModelCtrl) {
                        // Listen for 'refreshDatepickers' event...
                        scope.$on('refreshDatepickers', function refreshView() {
                            datepickerCtrl.refreshView();
                        });
                    }
                }
            };
            return $delegate;
        });
    });

然后在需要时拨打$scope.$broadcast('refreshDatepickers');。

如何在angular-bootstrap-datepicker中动态转换日期格式？

1 个答案: