观察和评价一个指令在属性表达

Question

（我不能让任何头衔，因为越短，我真的想马上做的一切。）

我想要做的是这样的：

<mySlider max="25 * scopefunction(scopevar)" 
      step="scopevar=='foo'? 0.5 : 0.25"/> 

<myOtherDirective factor="0.4/scopefunction(scopevar)"/> 

只要这些表达式的结果发生变化，指令就需要更新内容。有一个单选按钮在两个值之间切换scopevar，当发生这种情况时，mySlider和myOtherDirective都应该改变它们的工作方式;滑块获得不同的最大值和不同的步长，另一个指令得到一些用于某些计算的不同因子。

目前，我依靠

scope.$watch(attrs.max, function(newVal) { 
    console.log(newVal); 
} 

其工作正常step和factor，但max，newVal神秘变得NaN。并且scopefunction()确实总是返回一个数字。那么怎么可能是NaN？ max案件与其他案件有什么不同？

我的指令都有隔离范围。 scopefunction()是父范围的函数，所以它不能从指令中调用。我不希望这样，因为我希望指令尽可能通用，因为它们被重用了很多。而且在大多数地方，他们并没有用这些计算，所以我想保持这些属性的使用方式尽可能简单和干净。

我一直有和没有

scope: { 
    max: '@', 
    step: '@' 
} 

这似乎没有多大关系，因为我已经使用直接尝试attr.max它。

我很难过。为什么max有所不同？这怎么可能不起作用？

此外：问题似乎是'scopefunction（scopevar）'被评估为'undefined'，导致NaN，当我乘以它。我仍然不明白的是它在factor和step中的作用。

我制作了a plnkr，显示最大失败次数和成功步数。很抱歉，我无法复制factor了。至少不在隔离范围内。当我删除隔离范围时，factor工作。这意味着我需要删除隔离范围，但我不确定我想要那样做。我不希望我的指令污染父范围。

Answer 1

我发现，似乎工作的一种方式，是相当简单并保留隔离范围。 scope: { max: '&'}原来是相当无用的。我仍然不知道如何使用它。最好的办法似乎是将逻辑放在控制器中，并使用插值，单向数据绑定和$观察器来保持一切都是最新的。

控制器：

$scope.maxFunc = function() { 
    return 25 * $scope.scopeFunction($scope.scopeVar); 
} 

$scope.stepFunc = function() { 
    if ($scope.userInputData === 'maand') { 
     return 0.5; 
    } 
    else { 
     return 0.25; 
    } 
} 

HTML：

<div slider min="0" max="{{maxFunc()}}" step="{{stepFunc()}}" ng-model="sliderValue"></div> 

$观察家指令的控制器，以确保更新后的值转换为数字，因为"{{maxFunc()}}"将他们变成字符串：

$scope.$watch('min', function(min) { 
    $scope.min = $scope.parseInt(min, 1); 
}); 
$scope.$watch('max', function(max) { 
    $scope.max = $scope.parseInt(max, 10); 
}); 
$scope.$watch('step', function(step) { 
    $scope.step = $scope.parseFloat(step, 1); 
}); 

这就是我所想的。我的其他不依赖于变量max的滑块仍然像以往一样工作。

Answer 2

你可以告诉$看监视任何这样的表达：

scope.$watch(function() { 
    // return x + y; 
    // return myObject.myProperty; 
    // etc. 
    return myFunction(); 

}, function(newVal) { 

    console.log(newVal); 

} 

更多细节约$观看上AngularJS API Reference