绑定来自Angular指令的子元素值

问题描述

$scope.minutes = 1添加到指令中时,将ng-bind="minutes"绑定到scope: {finishcallback: "&"},的值不起作用。

我正在尝试使用Angular指令实现倒数计时器,但是当我在指令中定义范围函数时,无法将剩余的分钟和秒的值设置为子span元素。

<time id="countdown_{{order.Id}}" ng-if="order.StatusCode == 1" countdown="{{order.RemainingTimeToPrepareOrder}}" finishcallback="vm.countdownfinished(parameter)" callbackparameter="{{order.Id}}" countdownfinished="toggle()">                                        
  <b> <span class="value" ng-bind="minutes"></span>  dakika   <span class="value" ng-bind="seconds">--</span> saniye</b>
</time>

这是我的指令代码。

function countdown() {
    return {
        restrict: 'A',scope: {
            finishcallback: "&"
        },controller: function ($scope,$attrs,$timeout) {

            $attrs.$observe('countdown',function (value) {
                var ds = new Date();
                ds.setTime(value * 1000);

                $scope.days = '-';
                $scope.hours = $scope.minutes = $scope.seconds = '--';

                $scope.timeout = $timeout(update,1000);

                function update() {
                    now = +new Date();

                    $scope.delta = Math.round((ds - now) / 1000);
                    if ($scope.delta >= 0) {
                        $timeout(update,1000);
                    } else if ($attrs.countdownfinished) {
                        $scope.$apply($attrs.countdownfinished);
                    }
                }
            });
        },link: function ($scope,$element,$attrs) {
            $scope.$watch('delta',function (delta) {
                if (typeof delta === 'undefined') return;

                if (delta < 0) {
                    delta = 0;
                }

                $scope.days = Math.floor(delta / 86400);
                $scope.hours = forceTwoDigits(Math.floor(delta / 3600) % 24);
                $scope.minutes = forceTwoDigits(Math.floor(delta / 60) % 60);
                $scope.seconds = forceTwoDigits(delta % 60);
            });
            $scope.toggle = function () {
                $scope.finishcallback({ parameter: $attrs.callbackparameter });
            }
            function forceTwoDigits(num) {
                return String(num < 10 ? '0' + num : num);
            }

        }
    }
}

所有功能都将起作用,直到我在指令中添加finishcallback: "&"作用域变量为止。我添加了此功能以在倒计时完成时启用自定义函数调用。但是,当我添加此代码时,$scope.minutes之类的作业就停止了以更改跨度中的值。

即使我在指令中定义了范围,如何动态更改范围值?

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)