Ember.js Component properties data set by Ajax JSON

I am new to Ember.js and trying to get through that long learning curve. I have a Component that has an injected service, which makes an Ajax call. I can receive the JSON data successfully and can dump it into the console after the promise "THEN" returns. (I'm new to promises too, so bare with me)

Here's my component. I can see the dumped data, but how do I set the component properties with that JSON and have it accessible in the template? Also, why can't I use "this.get" in my function below?

import Ember from 'ember';
export default Ember.Component.extend({
    attr_types:  Ember.inject.service('svc-attrtypes'),
    atype_list: [],
    actions: {
        getATypes: function() {
            this.get('attr_types').getTypes().then(function(json){
                console.log(json);
                this.atype_list = json;
                console.log(this.atype_list);
                // below returns: TypeError: this.get is not a function
                this.get('atype_list').pushObjects(json); 
            });
        }
    }               

});

In my template I have this:

{{#each atype_list.alltypes as |a|}}
    <li>{{a.attr_type}} - {{a.attr_type_desc}}</li>
{{/each}}

If I manually place my JSON into the atype_list it shows perfectly on the template. But if I try to set it after my Ajax returns, nothing shows, except for in the console output.

I appreciate any help. I am sure I a missing something simple. ( or more likely, I'm just going about this all wrong)