javascript - 范围变量更改后重新评估传递给指令的属性

Question

我在 ng-repeat 中生成了一系列元素:

<tr ng-repeat="index in elements">
  <td ng-click="doSomething(index)" my-tooltip tooltip="isInBasket(index.id) && 'REMOVE FROM BASKET' || 'ADD TO BASKET'" ></td>
</tr>

指令MyTooltip期望将值传递给 tooltip属性。
这将在第一次运行，即执行 ng-repeat 时。如果元素已在购物篮中，则工具提示的值为“从购物篮中删除”，否则值为“添加到购物篮”。

函数定义如下:

$scope.isInBasket = (id){
  return _.contains($scope.basket, id)
}

现在，我的代码的其他部分将更改 $scope.basket ，所以我认为 isInBasket每当 $scope.basket 时都会重新评估更改并因此更改传递给 tooltip 的值属性。

指令

angular.module("tooltips", [])
    .directive("myTooltip", ($parse, $rootScope, $state){
      return {  
        restrict: 'A',
        priority: 999,
        link: function(scope, elm, attrs) {
          tooltip = scope.$eval(attrs.tooltip);
          // .... 
        }
      }
    })

但这不起作用，我很确定我做错了什么或者我错过了一些东西。

Answer 1

您是否正在创建一个隔离范围？如果是，那么您需要在您的范围中声明: { 工具提示:“&” }

我认为问题在于您绑定(bind)到一个 bool 值，因为不可置换会破坏双重绑定(bind)，但说实话，不确定您如何执行工具提示指令

尝试使用您的指令:

angular.module("tooltips", [])
  .directive("myTooltip", ($parse, $rootScope, $state){
    return { 
      scope: { tooltip: "=" } //you could try also "&"
      restrict: 'A',
      priority: 999    
    }
})

好的，如果您尝试分配如下值:

var tooltip = {dock: scope.$eval(attrs.tooltip)};

或者 var tooltip = element.scope()[attrs.tootip];

我的意思是我知道绑定(bind)对于对象来说非常重要。

如果这对您没有帮助，您可以将其与 watch 绑定(bind)，应该可以:

link: function(scope, elm, attrs) {
  var tooltip = element.scope()[attrs.tootip];

  scope.$watch(function () {
    return scope.attrs.tooltip; // i dont know what changes in your app
  }, function() {
    return  tooltip();
  }, true);