Question

在对我的上一个问题做出如此迅速的回应后，我以为我会试着和另一个人一起运气：o）

我正在使用jQuery UI排序来对ember视图进行排序。视图中的每个项目也是一个视图（如预告片）。

我在这里为didInsertElement的父视图添加了sortable。

<script type="text/x-handlebars">
  App.SimpleRowListView = Em.View.extend({
    didInsertElement: function() {
      this.$().sortable({
        handle: '.dragger',
        items: '.simple-row',
        axis: 'y',
        update: function(event, ui) {
          // update is probably the best event...
        }
     });
    },
  });
</script>

每当更新列表时，我想将simpleRow.listPosition值更新为其父元素中每个.simple-row的当前索引

我开始在每行使用的视图中添加一个updateListPosition函数

<script>
updateListPosition : function() {
  var index = $('#simple-row-wrapper .simple-row').index(this.$());
  this.getPath('content').set('listPosition',index);
},
</script>

我的目标是连接我的UI更新事件，以便在每个子视图上触发它。

我现在正在徘徊，更新事件是否应该调用控制器上的函数来遍历所有对象并设置listPosition。但是在控制器中我无法访问它。$（）因此无法计算索引

我的计划是使用listPosition作为控制器数组的排序属性。但是，如果有更好的方法对控制器数组进行排序，以便它反映使用.sortable（）

所做的更改

再次感谢。我想这可能是很多人想要在某个时候得到答案：）

Answer 1

您需要浏览视图。你可以循环每个调用你的updateListPosition函数（这是一个繁重的工作）或你可以做这样的事情

<script type="text/javascript">
  App.SimpleRowListView = Em.View.extend({
    didInsertElement: function() {
      var self = this;
      this.$().sortable({
        handle: '.dragger',
        items: '.simple-row',
        axis: 'y',
        update: function(event, ui) {
          var rows = self.$('.simple-row').toArray();
          rows.forEach(function(row) {
            var view = Ember.View.views[$(row).attr('id')];
            view.updateListPosition();
          });
        }
     });
    },
  });
</script>

或者一个看起来更轻松的版本：

<script type="text/javascript">
  App.SimpleRowListView = Em.View.extend({
    didInsertElement: function() {
      var self = this;
      this.$().sortable({
        handle: '.dragger',
        items: '.simple-row',
        axis: 'y',
        update: function(event, ui) {
          var rows = self.$('.simple-row').toArray();
          rows.forEach(function(row, position) {
            var view = Ember.View.views[$(row).attr('id')];
            view. updateListPosition(position);
            // pass the new position provided by forEach here and use it instead of calculating again
          });
        }
     });
    },
  });
</script>

ember.js - 在jquery UI更新上设置对象属性

1 个答案: