我有一个指令,但我在指令控制器中查看属性时遇到问题。
angular.module('app',[])
.directive('timer1', function () {
return {
template: '<div class="timerCont1"><div class="progressBar"></div></div>',
restrict: 'E',
replace:true,
scope: true,
controller: function ($scope, $element, $attrs) {
$scope.$watch($attrs.timerevent, function (value) {
switch ($attrs.timerevent)
{
case "start":
$scope.timeoutId = null;
$scope.countdown = Number($attrs.timer);
$scope.tick();
break;
case "stop":
$scope.stop();
break;
case "destroy":
alert()
$scope.stop();
$scope.$emit('destroy_pizza', {
});
}
},true);
$scope.tick = function () {
$scope.timeoutId = setTimeout(function () {
if ($scope.countdown <= 0) {
$scope.$apply(function () {
$attrs.$set('timerevent', 'destroy')
});
}
else {
$scope.countdown--;
$scope.tick();
}
$scope.$apply();
}, $attrs.interval);
};
$scope.stop = function () {
clearTimeout($scope.timeoutId);
$scope.timeoutId = null;
};
}
};
});
这是我的hTML
<timer1 interval="1000" timerevent="start" timer="10"></timer1>
当我将属性timerevent设置为&#34; destroy&#34;我的手表没有被调用,而属性已成功更新。