Question

我希望将数据存储到本地隔离范围，以加快速度，并从隔离范围方法访问存储数据。

不幸的是，我将null作为scope.scroller.scrollLeft（）的返回值。

还可以更新ng-show =＆＃34; canNext（）＆＃34;以比我更有效的方式？

app.directive("photos", function () {
    return {
        restrict: "E",
        replace: true,
        scope: {
            "photoid": "@",
            "size": "@",
            "height": "@",
            "list": "=",
            "prefix":"@",
            "suffix":"@",
            "extension": "@",
            "class": "@",
            "slide": "="
        },
        template: 
        '<div id="photos{{photoid}}Container"\n\
            style="position:relative"\n\
            ng-style="{display:list.length==1?\'inline-block\':\'block\', width: list.length==1?\'{{size||\'171px\'}}\':\'auto\', height: \'{{height||size||\'auto\'}}\'}">\n\
            <div id="photos{{photoid}}"\n\
                class="scroller hScrollable"\n\
                nng-class="doesScroll()&&\'hScrollable\'">\n\
                <div ng-repeat="p in list"\n\
                    ng-style="{\'background-image\': \'url({{prefix}}{{p.path?p.path+\'/\':\'\'}}{{p.file}}{{suffix}}.{{extension||\'jpg\'}})\', width: \'{{size||\'171px\'}}\', height: \'{{height||size||\'171px\'}}\'}"\n\
                    ng-click="$parent.$parent.openPopoverImageViewer(\'#photos{{photoid}}\', {{$index}})">\n\
                    <div>{{p.text||p.description}}</div>\n\
                </div>\n\
            </div>\n\
            <div class="prev" ng-if="list.length>1" ng-show="canPrev()" ng-click="left()"></div>\n\
            <div class="next" ng-if="list.length>1" ng-show="canNext()" ng-click="right()"></div>\n\
        </div>',
        link: function (scope, el, attrs) {
            scope.slide         = scope.slide||0;
            scope.prefix        = scope.prefix||"";
            scope.suffix        = scope.suffix||"";
            scope.extension     = scope.extension||"jpg";
            scope.scroller      = $("#photos"+scope.photoid);
            console.log("scope : "+scope.scroller);

            scope.scrollerWidth = scope.scroller.width();
            scope.width         = scope.list.length*(4+(scope.size||171));
            console.log("scope width: "+scope.width);

            scope.canPrev = function() {
                console.log("scope : "+scope.scroller+" - scrollLeft="+scope.scroller.scrollLeft());
                var scroller = $("#photos"+scope.photoid);
                return scroller.scrollLeft();
            };
        scope.right = function() {
            //console.log("scope.photos: right()");
            var scroller = $("#photos"+scope.photoid);
            var l = scope.list.length*(4+(scope.size||171))-scroller.width();
            if (l>0)
            scroller.animate({scrollLeft:l}, 200, function(){
                scope.$apply(scope.canPrev);
                scope.$apply(scope.canNext);
            });
        };

Answer 1

如果要在所有指令实例之间存储和共享数据，只需使用"this.data = something;"

如果您只想在实例中保留数据（元素），则可以使用元素的数据。

el.data("key",something);

然而，我的建议是创建一个＆＃34;命名空间＆＃34;对于你的指令如下：

var values = {"key":"value", "key2", "value"};
el.data("yourDirectiveName",values);

Angularjs：是否可以将持久数据存储到指令隔离范围中

1 个答案: