title: Cannot get simple Angular controller to display a value
body: <p>It is not my first time dealing with <a href="https://angularjs.org/" rel="nofollow">AngularJS</a> controllers, but for some reason this one refuses to work as expected. I get the feeling that I've forgotten something very basic here, but have no idea what.</p>
  
  <p>Here is my HTML:</p>
  
  <pre><code>&lt;html&gt;
  &lt;body&gt;
  &lt;script type="text/javascript" src="angular.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="app.js"&gt;&lt;/script&gt;
  &lt;div ng-app="MyApp"&gt;
      Hola mundo.
      &lt;div ng-controller="MyFirstCtrl as firstCtrl"&gt;
          Dentro de controller 1. Nombre: {{nombre}} &lt;br&gt; Propiedad: {{propiedad}} &lt;br&gt;
      &lt;input type="button" ng-click="setea()" value="Setea"&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>And here is my app.js:</p>
  
  <pre><code>var app = angular.module('MyApp',[]);
  app.controller("MyFirstCtrl",function() {
     this.nombre ='Me';
     this.propiedad ='Value';
  
      var setea = function(){
         alert('In function');
         this.nombre ='Another value';
         this.propiedad ='Another Property';
      };
  });
  </code></pre>
  
  <p>I believe Angular is loading correctly, because I don't see any errors on my console and the template values do not appear as {{nombre}} and {{propiedad}}. Instead they appear as blank. If I initialize these properties using ng-init, they display correctly. I've tried this in both Angular 1.2 and 1.3 with the same result.  </p>