AngularJs指令提供了不确定的整个时间

时间:2018-06-21 13:13:38

标签: javascript angularjs angularjs-directive

我对angularjs指令还很陌生,我一直在努力使我的指令能够工作范围。无论我做什么,durationTimeInput都返回未定义。

(function () {
'use strict';

angular.module('BlurAdmin.theme')
    .directive('durationInput', durationInput);

/** @ngInject */
function durationInput($window) {
    var tpl = '<div class="duration_time_input"> \
          <input ng-model="duration_time.hours" type="number" class="hours" placeholder="00" min="0" max="3" step="1" style="width: 45px"> \
        <span class="duration-time-sep">:</span> \
        <input ng-model="duration_time.minutes" type="number"  class="minutes" placeholder="00" min="0" max="59" step="1" style="width: 45px"> \
        </div>';

    return {
        restrict: 'A',
        template: tpl,
        replace: true,
        scope: {
            durationTimeInput: '='
        },
        link: function (scope, element, attrs) {
            console.log(scope);
            console.log(scope.durationTimeInput);
            scope.$watch('durationTimeInput', function (newValue) {
                var duration = moment.duration(newValue, 'minutes');

                scope.duration_time = {
                    hours: duration.hours(),
                    minutes: duration.minutes(),

                }
            });

            scope.$watchCollection('duration_time', function (newTime, oldTime) {
                if(scope.duration_time.hours==0&&scope.duration_time.minutes==0){
                    scope.duration_time.minutes=1;

                }
                scope.lapTimeInput = moment.duration(newTime, 'minutes').asMinutes();

            });
        }
    };
}

})();

我用div称呼

<div duration-input="myIndex.duration" id="scheduleDuration"></div>

myIndex.duration是一个变量。

1 个答案:

答案 0 :(得分:0)

尝试

<div duration-input duration-time-input="myIndex.duration" id="scheduleDuration"></div>

您需要根据定义的范围添加duration-time-input