AngularJS - обновление значения области с асинхронным ответом

Я пытаюсь поделиться некоторыми данными между контроллерами AngularJS. Также я получаю данные через HTTP-запрос. Когда я получаю доступ к данным от контроллера, оно равно null и позже (если вручную обновлять через пользовательский интерфейс), данные доступны. Я предполагаю, что проблема очень похожа на здесь Но все, что я пробовал в моем случае, не сработало. Пожалуйста, см. Скрипку

http://plnkr.co/edit/6SkzXK?p=preview

поэтому в контроллере я получаю данные через

//myService.setName(); //commented as it breaks the code

который устанавливает значение в сервисе и доступ через getName()

он, скорее всего, может быть разрешен через $rootScope.$apply, как в приведенной выше ссылке, но я не мог заставить его работать.

Ответ 1

Проблемы в том, что когда ваш контроллер инициализирован, вы копируете результат getName() в переменную $scope.name = myService.getName(). Поскольку $scope.name содержит строку, а не ссылку, она не обновляется при изменении getName().

Есть три способа решить эту проблему.

  • сделать $scope.name = myService.getName и использовать его как функцию Hello {{name()}}.
  • make myService.getName() возвращает объект типа { real_name: "foo" } и используйте name.real_name в представлении
  • привязать myService к области действия и напрямую использовать функцию getName $scope.myService = myService; и в представлениях myService.getName()

Я предпочитаю первое, дано более ясно. Второе - хорошее, когда у вас больше данных. Третий - не лучший способ в моем деле.

Ответ 2

Вам нужно сделать три вещи, чтобы заставить ваш плункер работать:

  • Ввести службу $http в новую службу
  • Определите функцию getName(), которую вызывает вызов
  • Передайте значение $scope в функцию setName() и измените значение в области $scope

http://plnkr.co/edit/6SkzXK