无法从Angular Directive中的服务访问对象属性

时间:2014-01-13 21:54:03

标签: javascript angularjs factory promise directive

我有一个输出roleName和id的JSON服务,我正在尝试使用该角色使用angular指令隐藏或显示应用程序中的元素。似乎服务已成功调用,并且从输出中填充了$ scope.data,但我似乎无法从数据对象访问该角色,因为控制台日志为$ scope.data.rolename读取未定义

.JS

app.directive('restrictTo', ['SecuritySvc', function (SecuritySvc) {
return {
    restrict: 'EA',
    replace: true,
    transclude: true,
    scope: {},
    controller: ['$scope', '$attrs', '$q', 'SecuritySvc', function ($scope, $attrs, $q, SecuritySvc) {
        $scope.data = SecuritySvc.getRole();

            if ($scope.data.roleName == $attrs.restrictTo) {
                $scope.allowed = true;
            } else {
                $scope.allowed = false;
            }

            console.log($scope.data); // showing in log
            console.log($scope.data.roleName); // Undefined

    }],
    template: '<div ng-show="{{ $scope.allowed }}" ng-transclude></div>'
}

上面代码中的控制台输出

$promise: Object
$resolved: true
roleId: 1
roleName: "Admin"

undefined

2 个答案:

答案 0 :(得分:1)

我觉得我对你的目的有些困惑。您正在创建延期承诺,然后立即解决它?这是否会破坏延迟/承诺模式处理异步调用的目的?您的SecuritySvc.getRole()方法是否正在进行AJAX调用以返回该数据?我一直以为AJAX调用应该是调用Promise::resolve完成后的线程。您是否尝试过使用$http

即使在这之后,我真的很困惑你可以成功地安装console.log data,但不能data.roleNamedata出现意味着无论您使用延期/承诺模式做什么,您都可以在需要的地方获得响应。您是否确定此时data对象的结构? data和您的信息之间没有图层?看到它隐藏在Angular方法和属性$promise$resolved中,我感到有些惊讶。

不知道是否有任何帮助...

答案 1 :(得分:0)

当你的指令创建一个独立的作用域(就像你的那样)并且服务正在访问视图控制器(而不是指令控制器)作用域时,我已经看到了这种行为。由于范围不同,$scope.data对象不同。

您可以通过在指令控制器中放置断点并在服务中放置另一个断点来检查范围ID号,并检查$ id值。有几种解决方法,但具体的解决方案将取决于您的具体实现。

阅读隔离的范围绑定 - “@”和“=”可能会有所帮助,请参阅:

http://docs.angularjs.org/guide/directive