AngularJS ngGrid 怎么给每列做range slider呢？ - 未名空间MITBBS历史存档

国际科技财经博客移民网络热点娱乐民生时事公众号

Redian新闻

>未名空间

>Programming - 葵花宝典

AngularJS ngGrid 怎么给每列做range slider呢？

AngularJS ngGrid 怎么给每列做range slider呢？# Programming - 葵花宝典

z*e2015-10-14 07:10

1 楼

http://www.itsnature.org/what-on-earth/10-beautiful-yet-toxic-c

l*i2015-10-14 07:10

2 楼

新手在学习中，看到这个例子http://plnkr.co/edit/?p=preview
想对每列值用slider滑动取值，怎么实现呢？
有code snippet 参考么？
谢谢

d*n2015-10-14 07:10

3 楼

http://rzajac.github.io/angularjs-slider/index.html

W*o2015-10-14 07:10

4 楼

https://material.angularjs.org/0.9.6/#/demo/material.components.slider

【在 l*********i 的大作中提到】

: 新手在学习中，看到这个例子http://plnkr.co/edit/?p=preview
: 想对每列值用slider滑动取值，怎么实现呢？
: 有code snippet 参考么？
: 谢谢

c*n2015-10-14 07:10

5 楼

非angular-md外就这个最好用

【在 d****n 的大作中提到】

: http://rzajac.github.io/angularjs-slider/index.html

c*e2015-10-14 07:10

6 楼

就这么个小功能也要用轮子？

【在 c******n 的大作中提到】

: 非angular-md外就这个最好用

l*i2015-10-14 07:10

7 楼

谢谢，不过我不是问slider怎么做。
而是问怎么为诸如table or grid里的每一个列 column的tab上做各自范围选择的range
slider啊。
单独的slider会的，就是不知道怎么做进表格里。
再谢谢啦。

【在 d****n 的大作中提到】

: http://rzajac.github.io/angularjs-slider/index.html

l*i2015-10-14 07:10

8 楼

可是，还是不知道怎么把 range slider做进表格的column里啊？range slider inside
of column
有类似的例子么？

【在 c*********e 的大作中提到】

: 就这么个小功能也要用轮子？

c*n2015-10-14 07:10

9 楼

这个轮子用了之后就不用手动写blur了
我有个应用是拖好了实时计算默认的啃爹货你拖一下他能给你计算几十次
其他几个轮子要listen global event
这个直接可以上

【在 c*********e 的大作中提到】

: 就这么个小功能也要用轮子？

c*n2015-10-14 07:10

10 楼

你用的是ng grid不是ui-grid？
如果你用ui的话
重写row的template就好了
他们网站有几个地方没更新
最新版的可用template是
rowTemplate: '

"(colRenderIndex, col) in colContainer.renderedColumns track by col.uid"
class="ui-grid-cell" ng-class="col.colIndex()" ui-grid-cell>

c*n2015-10-14 07:10

11 楼

哈哈你估计想不到这个表格轮子我的项目里给我改成什么样子了

l*i2015-10-14 07:10

12 楼

我在module里引用了ui.grid
多谢你哈，我去读一下，好多东西不是很明白。
对了，还有一个问题是，有什么办法可以多次为表格cell生成随机数字，用于每列过
滤呢， for test？
是要对每列cell单独随机生成，还是一起随机生成呢？

repeat=

【在 c******n 的大作中提到】

: 你用的是ng grid不是ui-grid？
: 如果你用ui的话
: 重写row的template就好了
: 他们网站有几个地方没更新
: 最新版的可用template是
: rowTemplate: '

: "(colRenderIndex, col) in colContainer.renderedColumns track by col.uid"
: class="ui-grid-cell" ng-class="col.colIndex()" ui-grid-cell>

c*n2015-10-14 07:10

13 楼

不确认看懂了你的需求
你页面载入的时候先把要放进grid的array处理下
那时候就可以产生随机数
如果页面载入后要改也不是不可以就是markup比较丑对应一个cell的地址加起来几
十个字母。。看得烦

【在 l*********i 的大作中提到】

: 我在module里引用了ui.grid
: 多谢你哈，我去读一下，好多东西不是很明白。
: 对了，还有一个问题是，有什么办法可以多次为表格cell生成随机数字，用于每列过
: 滤呢， for test？
: 是要对每列cell单独随机生成，还是一起随机生成呢？
:
: repeat=

l*i2015-10-14 07:10

14 楼

多谢chunjuan。
现在搞了个随机生成数据的data grid，在页面顶端为每个col做了range slider。
利用了uiGrid自带的condition: uiGridConstants.filter.xxx, 做filter。不过就是
这种方式只能手动输入选择值。
问题是： 1）有什么办法，把上面每列的range slider取的值放进condition:
uiGridConstants.filter 里面？？
2）还是老问题，有什么办法把slider 做进column header呢？

【在 c******n 的大作中提到】

: 不确认看懂了你的需求
: 你页面载入的时候先把要放进grid的array处理下
: 那时候就可以产生随机数
: 如果页面载入后要改也不是不可以就是markup比较丑对应一个cell的地址加起来几
: 十个字母。。看得烦

c*n2015-10-14 07:10

15 楼

1.expose grid.api
2.查文档找到对的template 改之

【在 l*********i 的大作中提到】

: 多谢chunjuan。
: 现在搞了个随机生成数据的data grid，在页面顶端为每个col做了range slider。
: 利用了uiGrid自带的condition: uiGridConstants.filter.xxx, 做filter。不过就是
: 这种方式只能手动输入选择值。
: 问题是： 1）有什么办法，把上面每列的range slider取的值放进condition:
: uiGridConstants.filter 里面？？
: 2）还是老问题，有什么办法把slider 做进column header呢？

l*i2015-10-14 07:10

16 楼

谢谢大牛的指导。
后来我在打算修改template的时候，发现可以用 UI Grid external filtering自己的
$scope.gridOptions.columnDefs[0].filter[0].term去给每一列单独做filter，同时$
watch把用户slider上value的change， bind到grid每列filters的condition框里，正
好做了个two way data binding。

【在 c******n 的大作中提到】

: 1.expose grid.api
: 2.查文档找到对的template 改之

c*n2015-10-14 07:10

17 楼

恩我就是用这个做了外部tree-view checkbox-ish filter

的
时$

【在 l*********i 的大作中提到】

: 谢谢大牛的指导。
: 后来我在打算修改template的时候，发现可以用 UI Grid external filtering自己的
: $scope.gridOptions.columnDefs[0].filter[0].term去给每一列单独做filter，同时$
: watch把用户slider上value的change， bind到grid每列filters的condition框里，正
: 好做了个two way data binding。