How to binding data from local json file. What i do wrong in this code? plz

[adisak1618]

i use jQuery to get persons.json from local file and set to this.employees. what should i do?

<link rel="import" href="../bower_components/polymer/polymer.html">



<script type="text/javascript" src="../bower_components/jquery-2.1.0.min/index.js"></script>


            <!--- render menu item ----->
              <dom-module id="employee-list">
                  <link rel="import" type="css" href="x-app.css">
                  <template>

                    <paper-menu class="list" on-iron-activate="_listTap">
                    <template is="dom-repeat" items="{{employees}}">


                        <paper-item>
                            <div> <span>{{item.nickname}}</span> </div>
                            <div> <span>{{item.phone}}</span> </div>
                        </paper-item>

                    </template>
                      </paper-menu>

                  </template>

                  <script>
                    Polymer({
                      is: 'employee-list',
                      ready: function() {


                            console.log(this.employees);
                         $.get('src/Persons.json',function(data){
                            this.employees = $.parseJSON(data).results;
                             console.log(this.employees);
                         });



                      }
                    });
                  </script>

                </dom-module>
              <!------- end render menu item ---------->

[adisak1618]

json file look like this

{ "results": [
{
"address": "",
"createdAt": "2015-06-13T15:59:54.223Z",
"email": "",
"facebook": "dtac",
"fbID": "dtac",
"fname": "Dtac",
"instagram": "",
"lineID": "",
"listObjID": "CImULW8LTV",
"lname": "",
"nickname": "",
"objectId": "qHAjGpfqP6",
"phone": "1678",
"position": "Data Call Center",
"updatedAt": "2015-06-18T17:34:47.786Z"
}
]}

[adisak1618]

i think, it because response time from jquery to get data.

[brian-cruickshank]

I think it's because you're using 'this' inside your callback function. Try the following: var _self = this; $.get('src/Persons.json',function(data){ _self.employees = $.parseJSON(data).results; console.log(_self.employees); });

…

On Wed, Jul 8, 2015 at 12:57 PM, adisak1618 <notifications@github.com> wrote: i think, it because response time from jquery to get data. — Reply to this email directly or view it on GitHub <#2048 (comment)>.

[adisak1618]

@brian-cruickshank Wowwww!! it work!!!

lot of thank :)

may be i need to read more, why can't use this in callback function

[brian-cruickshank]

'this' in javascript is very different than 'this' in object-oriented languages. An oversimplified explanation is that 'this' is determined by the call-site (where the callback function is called from). Putting a breakpoint in your callback function and evaluating 'this' is one way to get a feel for it. I've found the "You Don't Know JS" series of books - "this & Object Prototypes" and "Scope and Closures" to be worthwhile reading. Some online links to check into: - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures Brian

…

On Wed, Jul 8, 2015 at 2:20 PM, adisak1618 <notifications@github.com> wrote: @brian-cruickshank <https://github.com/brian-cruickshank> Wowwww!! it work!!! lot of thank :) may be i need to read more, why can't use this in callback function — Reply to this email directly or view it on GitHub <#2048 (comment)>.

[LM450N]

I think you can also use the JavaScript Function.bind instead of closure (I prefer this way).

Example:

$.get('src/Persons.json', function(data) {
    this.employees = $.parseJSON(data).results;
    console.log(this.employees);
}.bind(this));

And I think you can close the issue

[adisak1618]

thank you, it's work also @kevinpschaaf