Question

我想禁用某些可用的按钮组（我正在对这些按钮使用ngClick）仅针对活动用户，并在验证该帐户确实处于活动状态的请求后再次启用它们。

我目前的实施如下：

directive('activeCompanyButton', function(authService, companyService) {
    var defualtFunction = function(e){
      e.preventDefault();
    };
    function bind(elem){
      elem.addClass('disabled');
      elem.bind('click', defualtFunction);
    }
    function unbind(elem){
     elem.removeClass('disabled');
     elem.unbind('click', defualtFunction);
    }
    return{
      // scope: false,
      link: function(scope, elem, attrs){
        bind(elem);
      },
      controller: function($scope, $element, $attrs, authService, companyService){
        function checkCompanyStatus(val){
          var company = val;
           var r = company && company.status == 'active';  
           return r;
        }
        $scope.$watch(function(){return companyService.getCompanyData(authService.getCompanyId())}, function(val){
          console.log(val);
          if(checkCompanyStatus(val)){
            unbind($element);
            $element.bind('click', $scope.$eval($attrs.ngClick));
          }
          else{
            bind($element);
          }
        });
      }
    }
});

这些都没有用，甚至没有$ scope。$ eval（）（我应该从函数名中去掉'（）'并让函数给出函数引用而不是函数调用吗？）。 / p>

我应该使用隔离范围，我目前没有这样做，因为据我所知，这将创建多个脏检查实例（观察者）而不是一个。

Answer 1

在代码中假设这个结构：

<active-company-button>
    <button style="custom" other="blah" />
</active-company-button>

执行此操作的一种方法是将templateUrl属性添加到您的指令中，以包含一个包装标准按钮的模板。添加ng-disabled。然后，您可以为每个按钮利用ng-disabled的行为，而无需将其添加到每个按钮。缺点是你必须把造型和放大＆＃34;外部＆＃34;的其他属性指令而不是按钮本身。

所以，上面的代码会变成这样：

<active-company-button style="custom" other="blah" />

暂时停用按钮，直到某个服务功能使用自定义指令解析

1 个答案: