Question

我的表格包含日期输入字段。我需要通过datepicker更改它们。使用jquery-ui它工作正常，但我需要在angularjs上执行此操作。这就是我现在所拥有的，但它对我不起作用。的控制器：

.controller('TimesheetCtrl', ['$scope', 'restService',
     function($scope,  restService) {
         $scope.bindModel = function(data) {
             $scope.model = data;
         };
     restService.getTicketsInProgressList($scope.bindModel);
     }
]);

指令：

.directive('datepicker', function () {
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function (scope, element, attrs, ngModelCtrl) {
            $(function () {
                element.datepicker({
                    dateFormat: 'dd/mm/yy',
                    onSelect: function (date) {
                        scope.$apply(function () {
                            ngModelCtrl.$setViewValue(date);
                        });
                    }
                });
            });
        }
    };
});

HTML：

<tbody ng-repeat="item in model | orderBy: '-TaskDate'">
    <tr class="timesheet-day-block">
        <td colspan="5"> <span class="timesheet-date">{{item.TaskDate | date: MM/dd/yyyy}}</span>

        </td>
    </tr>
    <tr class="timesheet-table-rows" ng-repeat="list in item.TimesheetList">
        <td>{{list.ProjectName}}</td>
        <td>
            <!-- HERE IS THE PROBLEM -->
            <input type="text" placeholder="dd/mm/yyyy" ng-model="list.TaskDate | date: 'dd/MM/yyyy'" datepicker/>
        </td>
        <td> <a ng-href="#/tickets/ticket/{{ticket.Id}}">{{list.Task}}</a>

        </td>
        <td>
            <input type="text" value="{{list.TimeWorked}}" placeholder="Elapsed time" style="width: 98%" />
        </td>
        <td>
            <input type="text" value="{{list.Note}}" placeholder="Note" style="width: 98%" />
        </td>
    </tr>
</tbody>

Answer 1

您可以查看以下链接。

Fiddle

#include <string>
#include <math.h>

    static std::string decToBin(int number, bool littleEndianFirst)
    {
        std::string result = "";
        do
        {
            ((number & 1) == 0) ? result += "0" : result += "1";
            number >>= 1;
        } while(number);

        if(!littleEndianFirst)
        {
            result = Utils::reverse(result);
        }

        // byte completion
        unsigned int completeByteLength = (ceil(result.length()/8.0))*8;
        while(result.length() < completeByteLength)
        {
            littleEndianFirst ? result += "0" : result = "0" + result;
        }

        return result;
    }

    static std::string reverse(std::string to_reverse){
        std::string result;
        for (int i = to_reverse.length()-1; i >=0 ; i--)
            result += to_reverse[i];
        return result;
    }

Answer 2

在您的指令中注入$timeout并像这样使用它。

.directive('datepicker', function ($timeout) {
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function (scope, element, attrs, ngModelCtrl) {
            $timeout(function () {
                $(function () {
                    element.datepicker({
                        dateFormat: 'dd/mm/yy',
                        onSelect: function (date) {
                            scope.$apply(function () {
                                ngModelCtrl.$setViewValue(date);
                            });
                        }
                    });
                });
            });
        };
    }
});

angularjs指令中的jQuery-ui datepicker

2 个答案: