Question

首先我要的是：我有一系列的缩略图。当我点击一个时，我希望特定的缩略图显示在一个更大的div中，并附有描述。（以后：应该动画）。

现在我有指令和控制器，但我不知道如何设置适当的变量！

所以有些代码：第一个HTML：这是本节的根.jade文件。我有一个名为product的指令。

section
    .detail-view(ng-show="vm.showDetail")
      .prod-desc(ng-bind="vm.detailPic")
      .prod-img(ng-bind="vm.detailDesc")
    product.col-xs-12.product_tile(ng-repeat="item in vm.products", item="::item")

如您所见，产品指令是ng-repeat的一部分;出于这个原因，我希望显示已调整大小的图像的div是在之外迭代（.detail-view）。

产品指令：

'use strict';
ProductDirective.$inject = ['ShopCart', '$animate', 'User'];

function ProductDirective(ShopCart, $animate, User) {
    return {
        restrict: 'E',
        scope: {
            item: '='
        },
        template: require('./product.html'),
        link: link
    };

    function link(scope, element) {            
        scope.toggleDetails = toggleDetails; 
     }

     function toggleDetails() {
            if (!scope.isSelected && isBlurred()) return;

            scope.vm.detailPic  = scope.item.photo;
            scope.vm.detailDesc = scope.item.prod_description;
            scope.vm.isSelected = !scope.isSelected;
            scope.showDetail = !scope.showDetail;

            var action = scope.isSelected ?
     }
}

现在我要用big中的图像更新的div是在之外的迭代 - 因此超出了指令的范围。如何设置showDetail，showDesc和showPic？

的值

当我使用值为controllerAs的{{1}}时，我认为我可以vm，就像我在其他解决方案中看到的那样，在根对象上设置属性时，它会传播......但是我得到了

无法设置未定义
的属性'detailPic'

Answer 1

目前，在toggleDetails()

中有什么用（但看起来有些奇怪）

scope.$parent.$parent.vm.detailPic = scope.item.photo;
scope.$parent.$parent.vm.detailDesc = scope.item.prod_description;
scope.$parent.$parent.vm.showDetail = !scope.$parent.$parent.vm.showDetail

angularjs：从指令设置范围变量

1 个答案: