Question

我的服务包含以下代码：

.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"}]

来自控制器。然后，服务中的getChats由同一个控制器调用$scope.chats = ChatService.getChats();以显示在模板中。单击该项目时，将显示包含更多信息的新页面，从而显示服务中的getChat和getChats功能。控制器中用于加载更多详细信息的页面的代码是

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

但是我收到错误无法读取未定义的属性长度。现在，如果我将服务中的chats: this.ChatData更改为

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

它就像一个魅力，但我需要它实时显示控制器中的内容，因为我从服务器下载和接收信息，将实时更新聊天应用程序。

Answer 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 Reference.

通过Controller和$ stateParams将数据从服务传递到模板

1 个答案: