Question

我正在尝试使用Angular和Firebase实现一个简单的聊天示例。它适用于Safari，但它会冻结Chrome和Firefox（在本地或远程基础上运行）。有没有人对我的代码有什么问题有一些线索？谢谢你的帮助！

<html ng-app="ZzzzApp">
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.3/angular.js"></script>
    <script src="https://www.gstatic.com/firebasejs/3.7.2/firebase.js"></script>
    <script src="https://cdn.firebase.com/libs/angularfire/2.3.0/angularfire.min.js"></script>

    <script type="text/javascript">
        var app = angular.module('ZzzzApp',['firebase']);

        app.controller("ChatController", function($scope, $firebaseArray){  
            var config = {
               apiKey: "AIzaSyA8nk5dSF8HKUSQr_2H04hwTRZ2NWDwSOE",
               authDomain: "chattest-9fe81.firebaseapp.com",
               databaseURL: "https://chattest-9fe81.firebaseio.com",
               storageBucket: "chattest-9fe81.appspot.com",
               messagingSenderId: "353125975278"
            };
            firebase.initializeApp(config);

            var ref = firebase.database().ref().child('12345');
            $scope.messages = $firebaseArray(ref);

            $scope.addMessage = function(){
                $scope.messages.$add({direction: 'S', message: $scope.messageToSend});
                $scope.messageToSend = '';
            };   
        });
    </script>
</head>

<body>
    <div ng-controller="ChatController">    
        <div ng-repeat="message in messages">
            <p>{{message.message}}</p>
        </div>      
        <input type="text" class="form-control" ng-model='messageToSend'>
        <button type="button" class="btn btn-default" ng-click='addMessage()'>Send</button>
    </div>      
</body>

Answer 1

这似乎是Firebase ^ 3.7.1中的一个错误。有同样的问题，遇到了另一个answer。尝试指定Firebase版本：

dependencies: { "firebase": "3.7.0", "angularfire": "^2.3.0" ... }

Answer 2

不确定有什么问题 - 您的数据结构如何？

尝试更改addMessage函数，如下所示：

$scope.addMessage = function(){
    $scope.messages.$add({direction: 'S', message: $scope.messageToSend})
    .then(() => $scope.messageToSend = '')
};

确保在成功添加到firebase数组后，只清空messageToSend。控制台中的任何输出？

AngularFire简单示例冻结了Chrome和Firefox

2 个答案: