Обновление переменной в обратном вызове http запроса в угловых

Question

Это, вероятно, легко, но тем не менее. У меня есть вызов http в моем контроллере, где я загружаю файл json. Я хочу обновить переменную в моем HTML на основе результата. Он, по-видимому, обновляет переменную (console.log) в JS, но не в html. Есть ли способ использовать $apply с результатом или аналогичным? Что еще использовать? Вот (не) рабочий плнкр

JS:

    function SomeController($http){
  this.someValue = 'initial';
  $http.get('test.json').then(function (data) {
    this.someValue="changed";
    console.log("get request "+this.someValue);
  });
}

app.controller('someController', SomeController);

HTML:

<div ng-controller="someController as some">
      <p>{{some.someValue}}</p>
    </div>

Answer 1

Всякий раз, когда мы создаем функцию, она имеет свою собственную this(Контекст). В твоем случае this вы используете внутри $http.get функция успеха не this(контекст) из SomeController функция. Вы должны сохранить SomeController контекст функции внутри self переменная и затем использовать эту переменную в вашем обратном вызове успеха $http.get функционировать так, чтобы this будет рассматриваться как глобальная переменная.

контроллер

function SomeController($http){
  var self =this;
  self.someValue = 'initial';
  $http.get('test.json').then(function (data) {
    self.someValue="changed";
    console.log("get request "+this.someValue);
  });
}

Демо Планкр

Answer 2

this в вашем controller И в $http отличаются, потому что они находятся в другом блоке области видимости, поэтому назначьте this в другой переменной, как _this и использовать это.

Попытайся

function SomeController($http){
  var _this = this;
  _this.someValue = 'initial';
  $http.get('test.json').then(function (data) {
    _this.someValue="changed";
    console.log("get request "+_this.someValue);
  });
}