# Component how to modify it's own attributs value?

**URL:** <https://discuss.emberjs.com/t/component-how-to-modify-its-own-attributs-value/8586>\
**Category:** Uncategorized\
**Created:** [August 15, 2015, 4:41pm UTC](https://discuss.emberjs.com/t/component-how-to-modify-its-own-attributs-value/8586 "2015-08-15T16:41:55Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![scandinave](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/scandinave/32/11179_2.png) [@scandinave](https://discuss.emberjs.com/u/scandinave)\
**Post date:** [August 15, 2015, 4:41pm UTC](https://discuss.emberjs.com/t/component-how-to-modify-its-own-attributs-value/8586/1 "2015-08-15T16:41:55Z")

</div>

Hi, I need your help for something really easy i think. But i can’t get it work. I have a component with one attribute and one content.

```
{{#materialize-navbar-scrollspy-item anchor=category.name}}{{category.name}}{{/materialize-navbar-scrollspy-item}}

```

As you can see, content and anchor attribute come from the same variable but i want to sanitize the attribute’s value.

I tried this :

```
import Ember from 'ember';

export default Ember.Component.extend({
	tagName: 'li',
	__init : function() {
    	var anchor = this.get('anchor');
    	this.set('anchor', '#' + anchor.replace(" ","-"))
	}.on('didInsertElement')
});

```

With this code the value of content is also modify. I tried to call:

```
this.get('anchor').copy() 

```

but with this value, anchor is not set .

Any Idea?

---

<div class="post-metadata">

**Author:** ![jasonmit](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/jasonmit/32/182_2.png) [@jasonmit](https://discuss.emberjs.com/u/jasonmit)\
**Post date:** [August 15, 2015, 9:56pm UTC](https://discuss.emberjs.com/t/component-how-to-modify-its-own-attributs-value/8586/2 "2015-08-15T21:56:13Z")

</div>

You can hook into `didReceiveAttrs` hook: [JS Bin - Collaborative JavaScript Debugging](http://jsbin.com/tuwafu/edit?html,js,output)

I wouldn’t mutate the attr itself, since you can’t really guarantee that the attr is mutable and goes against DDAU, but you can shadow it with an internal state prop like in my above example.

---

<div class="post-metadata">

**Author:** ![scandinave](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/scandinave/32/11179_2.png) [@scandinave](https://discuss.emberjs.com/u/scandinave)\
**Post date:** [August 16, 2015, 6:04am UTC](https://discuss.emberjs.com/t/component-how-to-modify-its-own-attributs-value/8586/3 "2015-08-16T06:04:23Z")

</div>

Yeah, this is the solution. Thank you.
