Question

如何将变量“$ scope.dateformat”传递给“格式化” directive.Please 如果有任何可用或建议的例子，请告诉我。请为此提出更多示例。

     $scope.dateformat ="yyyy-mm-dd";

      menuModule.directive("datepicker", function(){
      return {
        restrict: "EAC", 
        require: "ngModel",
        scope: {
            "ngModel": "="
        },
        link: function(scope, elem, attr){
            $(elem).datepicker({
               format: "yyyy-mm-dd", // Above $scope.dateformat should be 
                                             //   called here
            }).on("changeDate", function(e){
                return scope.$apply(function(){
                    console.log(attr);
                    return scope.ngModel = e.format();
                });
            });

            return scope.$watch("ngModel", function(newValue){
                $(elem).datepicker("update", newValue);
            });
             }
          };
         });

Answer 1

您在全局范围内没有$ scope变量（我希望）。

第一种方法

如果此dataFormat用作全局配置，您可以将其作为常量注册为常量，如下所示：

menuModule.constant('DATE_FORMAT', 'yyyy-mm-dd');

然后将其注入您的指令：

menuModule.directive("datepicker", function(DATE_FORMAT){
    return {
        restrict: "EAC", 
        require: "ngModel",
        scope: {
            "ngModel": "="
        },
        link: function(scope, elem, attr){
            $(elem).datepicker({
                format: DATE_FORMAT
        });

        // .. rest is omitted
    };
});

第二种方法

如果您希望通过属性将格式传递给指令（从而使其在范围内可用），您可以将其添加为范围绑定，如下所示：

menuModule.directive("datepicker", function(){
    return {
        restrict: "EAC", 
        require: "ngModel",
        scope: {
            "ngModel": "=",
            "dateFormat": "@"
        },
        link: function(scope, elem, attr){
            $(elem).datepicker({
                format: scope.dateFormat
        });

        // .. rest is omitted
    };
});

然后，无论何时使用该指令，都可以传递如下格式：

<datepicker date-format="yyyy-mm-dd"></datepicker>

或者它是否来自控制器

<datepicker date-format="{{$ctrl.dateFormat}}"></datepicker>

Answer 2

Directive

    scope: {
        "format": "="
    },
    link: function(scope, elem, attr){
        $(elem).datepicker({
           format: scope.format
        })
    }

HTML

     <datepicker format="dateformat"></datepicker>

如何使用angularjs将日期格式从控制器传递到指令

2 个答案:

第一种方法

第二种方法