moment.js仅在同一文件中定义的两个指令之一可见

Question

同一个文件中有两个指令，两个指令都依赖于 moment.js 库。应用时，第一个指令（ momentNow ）会看到时刻功能，而另一个指令则不会（值未定义）。

两个指令都在同一个模板中使用：

模板

<datepicker date-format="yyyy-MM-dd">
    <!-- works correctly -->
    <input required ng-model="vm.dateFrom" moment-now />
</datepicker>

<datepicker date-format="yyyy-MM-dd">
    <!-- throws error -->
    <input required ng-model="vm.dateTo" moment-then />
</datepicker>

模块

;(function() {

    "use strict";

    angular.module('dateUtils', [])
        .directive('momentNow', momentNow)
        .directive('momentThen', momentThen);

    function momentNow() {
        return {
            /* params are omitted */
            link: function(scope, element, attrs, ngModel) {

                console.log(moment);

                var value = moment().format(scope.momentFormat || 'YYYY-MM-DD');
                ngModel.$setViewValue(value);
                ngModel.$render();
            }
        }
    };

    function momentThen() {
        return {
            /* params are omitted */
            link: function(scope, element, attrs, ngModel) {

                console.log(moment);

                var moment = moment();
                var format = scope.momentFormat || 'YYYY-MM-DD';
                var value = (moment.hours() >= 20 ? moment.add('days', 1) : moment).format(format);

                ngModel.$setViewValue(value);
                ngModel.$render();

            }
        }
    };

}());

Answer 1

在此行重命名变量：

var moment = moment();

你的变量是shadowing。

如果您想知道console.log(moment);显示undefined的原因，请查看hoisting是什么。