Question

我遇到了一个非常奇怪的问题，看不出我做错了什么......

我有一个非常简单的指令：

var widgets = angular.module('widgets', []);
widgets.directive('wdgtImageThumbnail', function ($compile) {
    return {
        restrict: 'E',
        replace: true,
        templateUrl: '/utilities/widgets/wdgtImageThumbnailPrtl.html',
        scope: {
            item: '=',
            imageSettings: '=',
            gotoItem: '&',
            showName: '='
        }, controller: function ($scope) {
            // get basePath and placeholderImage from plsConfig via controller
            // and configure item.image property as required
            var imageBasePath = $scope.imageSettings.imageBasePath;
            var placeholderImage = $scope.imageSettings.placeholderImage;
            $scope.thumbnailImage = imageBasePath + ($scope.item.image || placeholderImage);
        }
    };
});

以下是该指令的标记部分：

<div data-ng-click="gotoItem()">
    <div title="Click to view {{item.name}}'s details">
        <h4 class="logo-label" data-ng-show="showName">{{item.name}}</h4>
        <img data-ng-src="{{thumbnailImage}}" class="img-thumbnail logo-pic"/>
    </div>
</div>

当我登录网址并刷新浏览器时，指令会根据需要运行并显示item.image。

但是，如果我从页面导航到＆＃34;项目列表＆＃34;然后导航回＆＃34;项目＃34;，{{item.image}}在标记中没有约束力。

我已经使用Batarang进行了检查，在这两种情况下都使用了Batarang＆＃34; item＆＃34;是指令的范围。

因此，出于某种原因，在第二种情况下，绑定没有发生。为什么会这样？

编辑：

我在Plunker中模拟此问题时遇到了问题，因为问题与调用api的方式有关，而api尚未公开。

但是，我们已经确定我们所面临的问题与Angular resourcesw有关。出于某种原因，当我们刷新浏览器时，指令的控制器知道$scope.item是什么，但是当我们离开页面然后再返回时，$scope.item是未定义的。在我们迄今为止的测试中，我们正在使用$ resource。

这是调用我们的datacontext服务的控制器函数：

function getSubscriber() {
        vm.subscriber = subscriberCtx.getSubscriberById($routeParams.subscriberId);
    }

这是datacontext中的函数：

function getSubscriberById(id) {
        return $resource('/api/v1/Subscribers/:id').
            get({id:id});
    }

vm.subscriber是作为item属性传递给指令的对象。

我发现真正奇怪的是，如果我在通过和失败的情况下都记录$scope.item指令，则会记录该对象，并且在每种情况下日志都是相同的。

那么，为什么在没有刷新浏览器的情况下，指令看不到$scope.item？

如果我传入一个简单的json对象，该指令工作正常，但我们正在努力使用$ resource和restangular来处理它。

指令范围不与$ resource绑定

0 个答案: