Javascript 在完成http.jsonp时,如何使用ng infinite scroll并更新另一个DOM元素?

Javascript 在完成http.jsonp时,如何使用ng infinite scroll并更新另一个DOM元素?,javascript,jquery,html,angularjs,Javascript,Jquery,Html,Angularjs,这是我的密码 var fetchMyWorks = angular.module('fetchMyWorks', ['infinite-scroll']); var bookContainerHeight = 341; var bookContainerWidth = 180; var gapBetweenEachColumn = 13; var gapBetweenEachRow = 13; var initial = 46; // height from top var defaultHe

这是我的密码

var fetchMyWorks = angular.module('fetchMyWorks', ['infinite-scroll']);

var bookContainerHeight = 341;
var bookContainerWidth = 180;
var gapBetweenEachColumn = 13;
var gapBetweenEachRow = 13;
var initial = 46; // height from top
var defaultHeight = 662;

fetchMyWorks.controller('StoriesController', function($scope, MyWorks) {
  $scope.my_works = new MyWorks();
  $scope.row_gap_style = function(n) {
    if (n == 0) {
      rowGapStyle = "top: " + initial  + "px;";
    } else {
      rowGapStyle = "top: " + ((bookContainerHeight + gapBetweenEachRow) * n) + "px;";
    }
    return rowGapStyle;
  };
  $scope.col_gap_style = function(index) {
    colGapStyle = "left: 0px;"; 
    if (index % 3 == 1) {
      colGapStyle = "left: " + (bookContainerWidth + gapBetweenEachRow) + "px;";
    }
    if (index % 3 == 2) {
      colGapStyle = "left: " + ((bookContainerWidth + gapBetweenEachRow) * 2) + "px;";
    }
    return colGapStyle;
  };
  $scope.fetch_s3_cover = function(s3_url_prefix, item) {
    cover = item.Cover.filename;
    if (cover !== null) {
      coverUrl = s3_url_prefix + 'files/story_file/filename/' + item.Cover.id + '/' + cover;
      return "width:180px; height: 254px; top:0px; left:0px; background: url('" + coverUrl + "') no-repeat; background-size: cover; border: 1px solid #DCDDDE;"
    }
    return '';
  };
  $scope.update_height = function() {
    return "height: " + defaultHeight + "px;";
    if ($scope.my_works.page > 1) {
      var newHeight = defaultHeight + (($scope.my_works.page - 1) * 308)
      return  "height: " + newHeight + "px;";
    }
  };
});

// MyWorks constructor function to encapsulate HTTP and pagination logic
fetchMyWorks.factory('MyWorks', function($http) {
  var MyWorks = function() {
    this.items = [];
    this.busy = false;
    this.page = 1;
    this.after = '';
    this.perPage = 6;
    this.maxLimit = 100;
  };

  MyWorks.prototype.nextPage = function() {
    if (this.busy) return;
    this.busy = true;
    var url = "/my_works.json?page=" + this.page + "&top=" + this.perPage + "&callback=JSON_CALLBACK";
    $http.defaults.headers.jsonp = { 'Accept' : 'application/json', 'Content-Type' : 'application/json' };
    $http.jsonp(url).success(function(data, status, headers, config) {
      var items = data.stories;
      this.maxLimit = data.paging.count;
      for (var i = 0; i < items.length; i++) {
        if (this.items.length < this.maxLimit) {
          this.items.push(items[i]);
        }
      }
      this.page = parseInt(this.items.length / this.perPage) + 1;
      this.busy = false;
    }.bind(this));
  };

  return MyWorks;
});

fetchMyWorks.filter('range', function() {
  return function (input, total) {
    total = parseInt(total);
    for (var i = 0; i < total; i++) {
      input.push(i);
    }
    return input;
  }
});
var fetchMyWorks=angular.module('fetchMyWorks',['infinite-scroll']);
var bookContainerHeight=341;
var bookContainerWidth=180;
各色谱柱之间的var间隙=13;
各通道之间的var间隙=13;
var初始值=46;//离顶高度
var defaultHeight=662;
控制器('StoriesController',函数($scope,MyWorks){
$scope.my_works=new MyWorks();
$scope.row\u gap\u style=函数(n){
如果(n==0){
rowGapStyle=“顶部:“+initial+”px;”;
}否则{
rowGapStyle=“top:”+((bookContainerHeight+gap之间的间隙)*n)+“px;”;
}
返回行间距样式;
};
$scope.col\u gap\u style=函数(索引){
colGapStyle=“左:0px;”;
如果(索引%3==1){
colGapStyle=“left:”+(bookContainerWidth+gap之间的间隙)+“px;”;
}
如果(索引%3==2){
colGapStyle=“left:”+((bookContainerWidth+gap之间的间隙)*2)+“px;”;
}
回风口;
};
$scope.fetch\u s3\u cover=函数(s3\u url\u前缀,项){
cover=item.cover.filename;
如果(封面!==null){
coverUrl=s3_url_prefix+'files/story_file/filename/'+item.Cover.id+'/'+Cover;
返回“宽度:180px;高度:254px;顶部:0px;左侧:0px;背景:url(“+coverUrl+”)不重复;背景大小:封面;边框:1px实心#DCDDDE;”
}
返回“”;
};
$scope.update_height=函数(){
返回“高度:”+defaultHeight+“px;”;
如果($scope.my_works.page>1){
var newHeight=defaultHeight+($scope.my_works.page-1)*308)
返回“高度:”+newHeight+“px;”;
}
};
});
//MyWorks构造函数,用于封装HTTP和分页逻辑
fetchMyWorks.factory('MyWorks',函数($http){
var MyWorks=函数(){
此参数为.items=[];
this.busy=false;
本页=1;
这个。在=“”;
这个.每页=6;
此.maxLimit=100;
};
MyWorks.prototype.nextPage=函数(){
如果(这个忙)返回;
this.busy=true;
var url=“/my_works.json?page=“+this.page+”&top=“+this.perPage+”&callback=json_callback”;
$http.defaults.headers.jsonp={'Accept':'application/json','Content Type':'application/json'};
$http.jsonp(url).success(函数(数据、状态、标题、配置){
var items=data.stories;
this.maxLimit=data.paging.count;
对于(变量i=0;i
我使用的是来自

每当获取最新数据时,我想更改另一个DOM元素的高度


我想避免使用jQuery。有没有办法用angularjs做到这一点?

U应该这样做

$http.jsonp(url).success(function(data, status, headers, config) {
       if(!data) {
         var element = document.querySelectorAll('#dom-id')[0];
         element.style.hiegth = "300px";
       }
   });