Question

使用此测试内容：

<ion-content class="has-header" delegate-handle="menu">
   <div id="activeitem">Test</div>
   <button ng-click="vm.scrollToActiveElement()">Test Scroll</button>
</ion-content>

我想获得activeitem元素的位置：

vm.scrollToActiveElement = function () {

    var elem = document.getElementById('activeitem');
    if (!elem)
        return;
    var position = $ionicPosition.position(elem);     

};

但是对$ionicPosition.position的调用会导致此错误：

无法读取未定义
的属性'getBoundingClientRect'

Answer 1

你几乎就在那里。事实上，这种方法在离子文档中的记录很少。

我在挖掘源代码后想到的是，因为这些方法是jQuery等效的，总是返回元素数组，所以传递给这些函数的参数应该是数组，第0个索引指向实际DOM如下所示

vm.scrollToActiveElement = function() {

  var elem = document.getElementById('activeitem');
  if (!elem)
    return;
  var position = $ionicPosition.position([elem]); //not just elem    

};
/*it returns the offset of param[0] 
where param is the parameter passed to this function
*/

/*That is we need to wrap the dom element inside array as these methods are inspired 
from jQuery and jQuery wraps the matched element inside array 
  
If you are using AngularJS's jqLite, please verify if actual 
DOM is in array 0th position or not

*/

如何使用$ ionicPosition.position

1 个答案: