Question

我的应用程序中有一个标题，它使用一个指令来显示/隐藏链接，具体取决于用户权限，该指令使用一个服务，该服务返回一个带有布尔结果的已解析的promise。问题是标题导航链接没有正确显示/隐藏（它显示以前的用户可访问链接，所以我假设服务没有被调用），当我使用chrome控制台进行调试时我希望显示一些日志在服务或指令但没有任何东西，我看到日志的唯一方法是重新加载页面。

指令：

.directive('hasAccess', ['PermissionsService', function( PermissionsService) {
return {
  restrict: 'A',
  scope: {
    requiredAccess: "@",
    requiredAccessFunc: '@'
  },
  link: function(scope, element, attrs) {
    PermissionsService[scope.requiredAccessFunc](scope.requiredAccess, scope.locationId).then(function(bool) {
      console.log("hasAccess");
      if (!bool) {
        element.addClass('hidden');
      }
    }, function(error) {
      element.addClass('hidden');
    });
  }
};
}])

服务：

smps.checkSettingsAccess = function(settingName) {
  console.log("checkSettingsAccess");
  var deferred = $q.defer();
  UserFactory.get().$promise.then (function(response) {
    deferred.resolve(response[settingName]);
  }, function() {
    deferred.reject(response);
  });
  return deferred.promise;
}

标题指令：

.directive('header', function () {
return {
  restrict: 'A',
  replace: true,
  templateUrl: "directives/header.html",
  controller: ['$scope', '$filter', function ($scope, $filter) {

    }]
}

}）

标题html：

<li><a has-access required-access="company_access" required-access-func="checkSettingsAccess" ng-href="#/company_info">Company</a></li>
<li><a has-access required-access="locations_access" required-access-func="checkSettingsAccess" ng-href="#/locations">Locations</a></li>
<li><a has-access required-access="staff_members_access" required-access-func="checkSettingsAccess" ng-href="#/staff_members">Staff</a></li>
<li><a has-access required-access="customers_access" required-access-func="checkSettingsAccess" ng-href="#/customers">Customers</a></li>
<li><a has-access required-access="online_scheduling_access" required-access-func="checkSettingsAccess">Online Scheduling</a></li>

Answer 1

您的指令监视父作用域中的两个变量： scope: { requiredAccess: "@", requiredAccessFunc: '@' }

如果要渲染指令，则应更改此变量。因为你的指令取决于内部状态。

Answer 2

为什么var type = Type.GetType(typeName); var instance = Activator.CreateInstance(type);通过smps.checkSettingsAccess或deferred.resolve();但deferred.reject();通过了布尔，你确定这是正确的吗？ .then(function(bool)函数中bool的值是多少？它可能是一个对象，因此总是如此？

我建议不要只这样做：
then
你做这个： element.addClass('hidden');
将所有HTML默认内容放到element.removeClass('hidden');，因为它是一个安全问题，在AJAX发生时应默认隐藏。

Answer 3

到目前为止，我所做的是：

删除hasAccess指令
将currentUser添加到rootScope，如：$ rootScope.currentUser
使用currentUser询问给定访问权限是否为真（显示）或是否为假（隐藏）

我知道......这不是最好的解决方案，因为它有点难看，但至少它有效。

我需要了解的是如何创建依赖于注入服务的头指令（该服务通过rootScope使用ng-resource），当rootScope.currentUser发生变化时，该指令应该能够重新加载或捕获它所以它正确显示HTML中的链接。

随时建议改进或任何评论。谢谢！

    <li><a ng-show="currentUser['company_access']" ng-href="#/company_info">Company</a></li>
    <li><a ng-show="currentUser['locations_access']" ng-href="#/locations">Locations</a></li>
    <li><a ng-show="currentUser['staff_members_access']" ng-href="#/staff_members">Staff</a></li>
    <li><a ng-show="currentUser['customers_access']" ng-href="#/customers">Customers</a></li>
    <li><a ng-show="currentUser['online_scheduling_access']">Online Scheduling</a></li>

页面更改时，不会正确调用AngularJs指令

3 个答案: