my english isn't very good, apologise in advice

i'm working whit ember.js and i would like that the ac function run when the components/graph-pie render. i know that i need to put an observer and i read the documentation, but i don't understand where and how put the observer.

this is the code

index.html

```
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>COMPONENT</title>
  <script src="js/libs/jquery-1.10.2.js"></script>
  <script src="js/libs/handlebars-1.1.2.js"></script>
  <script src="js/libs/ember-1.2.0.js"></script>
  <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
  <script src="js/app.js"></script>
  <link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/style.css">
</head>
<body>

 <script type="text/x-handlebars">
  <div>prova<div>
  <button> {{#link-to "graphs"}}graph{{/link-to}}</button>
  {{outlet}}
 </script>

 <script type="text/x-handlebars" data-template-name="graphs">
  {{graph-pie}}
 </script>

 <script type ="text/x-handlebars" id="graphs" data-template-name="components/graph-pie">
   <div id="BC">
     <div id="Gphic">
     </div>
   </div>
 </script>
</body>
</html>

```

app.js

```
App = Ember.Application.create();

App.Router.map (function (){
  this.route("graphs");
});

App.GraphsRoute = Ember.Route.extend ({
  model: function() {
    return data;
  }
});

App.GraphPieComponent = Ember.Component.extend({
  actions: {
    ac: function () {
      //do something
    }
  }
})

App.GraphsController = Ember.ArrayController.extend({

}); 

var data= ...

```