从ember对象

Question

Ember Ebie和我有一种感觉，我在这里做了一些非常错误的事情。基本上，我试图使用一个操作从自定义ember对象中删除一个键。该操作将键作为参数（虽然这是一种非常简洁的方法 - 也许我错过了更多＆＃34; ember＆＃34;这样做的方法？）

我创建了twiddle

我能够将值设置为null哪种有效，但我更喜欢完全删除键和值。我认为.removeObject（key）将是票证，但它不起作用。控制台抱怨：

Uncaught TypeError: thisData.removeObject is not a function

所以我认为我在错误的环境中使用它。

这是我的示例控制器：

import Ember from 'ember';

const UrlObj = Ember.Object.extend({});

export default Ember.Controller.extend({
    urlData: UrlObj.create({
        queryParams: {
            filter_breadcrumb: [
                'Jewelry > Rings',
                'Clothing and Accessories > Sweaters'
            ],
            filter_price: ['100.0-200.0'],
            filter_size: ['S','L'],
            paging: 18,
            q: 'gold',
            search_sort: 'relevance'
        }
    }),
    actions: {
        deleteStuff(key) {
            alert("deleteStuff called with " + key);
            let thisData = Ember.get(this.urlData, 'queryParams');

            //thisData.removeObject(key); // doesn't work, wrong context?
            //Ember.get(this.urlData, 'queryParams').removeObject(key); // doesn't work, wrong context?
            //delete thisData[key]; // this deletes it from the object but it's JS so ember is not aware of it

            Ember.set(thisData, key, null); // this kind of works, but I'd like to remove the key AND the value
        }
    }
});

我评论了不起作用的行。

这是我的模板：

here's the data list:<br>
{{#each-in urlData.queryParams as |key value|}}
<a href="#" {{action "deleteStuff" key}}>{{key}}: {{value}}</a><br>
{{/each-in}}

任何帮助表示赞赏！

Answer 1

您需要通知属性已更改。

无需使用Ember.Object

export default Ember.Controller.extend({
    urlData: {
        queryParams: {
            filter_breadcrumb: [
                 'Jewelry > Rings',
                 'Clothing and Accessories > Sweaters'
            ],
            filter_price: ['100.0-200.0'],
            filter_size: ['S','L'],
            paging: 18,
            q: 'gold',
            search_sort: 'relevance'
        }
    },
  actions: {
        deleteStuff(key) {
      alert("deleteStuff called with " + key);
      let thisData = Ember.get(this.urlData, 'queryParams');     
      delete thisData[key]; 
      this.notifyPropertyChange('urlData');


    }
  }

});

Answer 2

无需使用“notifyPropertyChange”

export default Ember.Controller.extend({

urlData: {
    queryParams: { 

        filter_breadcrumb: [
             'Jewelry > Rings',
             'Clothing and Accessories > Sweaters'
        ],
        filter_price: ['100.0-200.0'],
        filter_size: ['S','L'],
        paging: 18,`enter code here`
        q: 'gold',
        search_sort: 'relevance'
    }
},
actions: {

  deleteStuff(key) {
  alert("deleteStuff called with " + key);
  let thisData = this.get('urlData').queryParams;     
  delete thisData[key]; 
  console.log(this.get('urlData')); //u ll get deleted data


}
}

});