Передача данных из сервиса в шаблон через контроллер и $stateParams

#angularjs #angularjs-scope #angularjs-controller #angular-services

#angularjs #angularjs-область действия #angularjs-контроллер #angular-сервисы

Вопрос:

У меня есть сервис со следующим кодом:

 .service('ChatService', function() {
  return { //Gets Data from controller
    sendData: function(data) { 
      this.chatData = data;
      console.log('this.chatData: ' this.chatData);
    },
    chats: this.chatData,
    getChats: function() {
      return this.chatData;
    },
    getChat: function(chatId) {
      for(i=0; i<this.chats.length; i  ) {
        if (this.chats[i].id == chatId) {
          return this.chats[i];
        }
      }
    }
  }
})
  

Здесь важно то, что sendData извлекает информацию

 [{id: 1, message: "Chat Message 1"},{id: 2, message: "Message 2"}]
  

из контроллера. Затем тот же $scope.chats = ChatService.getChats(); контроллер вызывает getChats в сервисах для отображения в шаблоне.
При нажатии на этот элемент отображается новая страница с дополнительной информацией, следовательно getChat , getChats функция and в сервисе.
Код в контроллере для страницы для загрузки более подробной информации

 $scope.chatId = $stateParams.chatId;
$scope.chat = ChatService.getChat($scope.chatId);
  

Однако я получаю сообщение об ошибке не удается прочитать длину свойства undefined. Теперь, если я изменю chats: this.ChatData в сервисах на

 chats: [{id: 1, message: "Chat Message 1"},{id: 2, message: "Message 2"}]
  

Это работает как шарм, но мне нужно, чтобы он отображал в режиме реального времени то, что находится в контроллере, потому что я загружаю и получаю информацию с сервера, которая будет обновляться в режиме реального времени для приложения чата.

Комментарии:

1. вы должны использовать SignalR для получения сигнала ответа в реальном времени.

Ответ №1:

Используется angular.copy для обновления ссылки:

 app.service('ChatService', function() {
    //Gets Data from controller
    this.sendData = function(data) { 
      //this.chatData = data;
      //console.log('this.chatData: ' this.chatData);
      //Use angular.copy
      angular.copy(data, this.chats);
    };
    this.chats = [];
    this.getChats = function() {
      return this.chats;
    };
    this.getChat =  function(chatId) {
      for(i=0; i<this.chats.length; i  ) {
        if (this.chats[i].id == chatId) {
          return this.chats[i];
        };
      };
    };
});
  

При использовании функции angular.copy обновления ссылки на массив контроллеры, которые ранее извлекли ссылку, будут обновлены.

Дополнительные сведения см. в разделе AngularJS angular.copy Ссылка на API.