AngularJS数据网格，单击将元素滚动到封闭div的顶部

我在伦敦有一个温泉浴场。我有一个项目的数据网格。我希望当网格中的某个项被单击时，它会应用一个特定的类，然后该项会滚动到封闭div的顶部

请参见此处的Plunkr：

我有应用这个类的代码，但是我很难让活动（应用了类“open”的元素）滚动到封闭div的顶部

var-app=angular.module（'plunker'，[]）；
应用程序控制器（'MainCtrl'，函数（$scope）{
$scope.cart=[]；
$scope.addToCart=函数（索引）{
$scope.cart.push（索引）；
$scope.cartCount=$scope.cart.length；
警报（$scope.cartCount）；
}
$scope.activeRow=函数（索引）{
$scope.selectedRow=索引；
}
$scope.dataObject=[{
“编号”：“001”，
“状态”：“国家编目局”，
“化合物”：“CD19A”
}, {
“编号”：“002”，
“状态”：“NCA”，
“化合物”：“CD19B”
}, {
“编号”：“003”，
“状态”：“NCR”，
“化合物”：“CD33C”
}, {
“编号”：“004”，
“状态”：“NCX”，
“化合物”：“CD33D”
}, {
“编号”：“005”，
“状态”：“NCT”，
“化合物”：“CD33E”
}, {
“编号”：“006”，
“状态”：“NC9”，
“化合物”：“CD20F”
}, {
“编号”：“007”，
“状态”：“NC8”，
“化合物”：“CD20G”
}, {
“编号”：“008”，
“状态”：“NCX”，
“化合物”：“CD20H”
}, {
“编号”：“009”，
“状态”：“状态”，
“化合物”：“CD33I”
}, {
“编号”：“010”，
“状态”：“NCT”，
“化合物”：“CD33J”
}
];
});
/*将您的css放在这里*/
身体{
背景：#eee；
}
马车{
显示：块；
高度：70像素；
背景：银；
左边距：20px；
宽度：200px；
填充物：5px10px；
边缘底部：20px；
边缘顶部：20px；
}
.购物车h1{
颜色：#fff；
线高：20px；
}
.项目列表包装器{
高度：300px；
宽度：740px；
边框：1px实心#ddd；
溢出y：滚动；
左边距：20px；
}
.项目清单{
高度：70像素；
宽度：100%；
边缘底部：10px；
盒影：02px2pRGBA（0,0,0,0.2）；
边框：1px实心#fff；
背景：EFE4；
}
李{
显示：内联块；
列表样式：无；
填充：0 40px 40px 40px；
字体大小：24px；
}
.打开{
高度：300px；
背景：#fff；
}

安古拉斯普朗克
文件。写（“”）；
购物车：{{cartCount}

{{data.Number}
{{data.Status}
{{data.component}



看起来我可以使用$anchorScroll，使用锚点ID移动到给定的元素


var-app=angular.module（'plunker'，[]）；
应用程序控制器（'MainCtrl'，函数（$scope）{
$scope.cart=[]；
$scope.addToCart=函数（索引）{
$scope.cart.push（索引）；
$scope.cartCount=$scope.cart.length；
警报（$scope.cartCount）；
}
$scope.activeRow=函数（索引）{
$scope.selectedRow=索引；
$location.hash（）；
$anchorScroll（'Anchors-'+指数）；
}
$scope.dataObject=[{
“编号”：“001”，
“状态”：“国家编目局”，
“化合物”：“CD19A”
}, {
“编号”：“002”，
“状态”：“NCA”，
“化合物”：“CD19B”
}, {
“编号”：“003”，
“状态”：“NCR”，
“化合物”：“CD33C”
}, {
“编号”：“004”，
“状态”：“NCX”，
“化合物”：“CD33D”
}, {
“编号”：“005”，
“状态”：“NCT”，
“化合物”：“CD33E”
}, {
“编号”：“006”，
“状态”：“NC9”，
“化合物”：“CD20F”
}, {
“编号”：“007”，
“状态”：“NC8”，
“化合物”：“CD20G”
}, {
“编号”：“008”，
“状态”：“NCX”，
“化合物”：“CD20H”
}, {
“编号”：“009”，
“状态”：“状态”，
“化合物”：“CD33I”
}, {
“编号”：“010”，
“状态”：“NCT”，
“化合物”：“CD33J”
}
];
});
/*将您的css放在这里*/
身体{
背景：#eee；
}
马车{
显示：块；
高度：70像素；
背景：银；
左边距：20px；
宽度：200px；
填充物：5px10px；
边缘底部：20px；
边缘顶部：20px；
}
.购物车h1{
颜色：#fff；
线高：20px；
}
.项目列表包装器{
高度：300px；
宽度：740px；
边框：1px实心#ddd；
溢出y：滚动；
左边距：20px；
}
.项目清单{
高度：70像素；
宽度：100%；
边缘底部：10px；
盒影：02px2pRGBA（0,0,0,0.2）；
边框：1px实心#fff；
背景：EFE4；
}
李{
显示：内联块；
列表样式：无；
填充：0 40px 40px 40px；
字体大小：24px；
}
.打开{
高度：300px；
背景：#fff；
}

安古拉斯普朗克
文件。写（“”）；
购物车：{{cartCount}