ng-repeat 中的 Firebase 和 AngularFire 错误仅在 IE8 中答案

【问题标题】：Firebase and AngularFire error in ng-repeat only in IE8ng-repeat 中的 Firebase 和 AngularFire 错误仅在 IE8 中
【发布时间】：2013-10-18 22:31:03
【问题描述】：

我有一个使用 angular 和 firebase 的应用程序。它调用我的 firebase url，并对返回的对象中的 2 个项目进行简单的 ng-repeat。

该应用程序在除 Internet Explorer 8 之外的所有浏览器中都运行良好。我经常在 IE 8 中对其进行测试，它运行良好。并不是说我已经启动了它，而是在过去几天的某个时候它开始收到此错误。这段时间我对应用程序进行了更改，但我认为没有任何事情会改变 IE8 的呈现方式。

IE8中的错误很简单：

SCRIPT5007：无法设置未定义或空引用的属性“艺术家” firebase.js，第 1 行字符 28

我已将代码简化为基础，但仍然出现错误。

您可以在下面看到，艺术家是 $scope.xmatch 中我试图用 ng-repeat 重复的对象的名称。我必须得到这个工作，所以任何帮助将不胜感激。

app.js

(function() {
'use strict';
angular.module('ipremiosApp', ['firebase']).config
}).call(this);

global.js

(function() {
  'use strict';
  angular.module('ipremiosApp').controller('GlobalCtrl',['$scope','$timeout',    function($scope, $timeout) {
}]);

angular.module('ipremiosApp').controller('MatchCtrl',['$scope','$timeout','$routeParams','angularFire', function($scope,$timeout,$routeParams,angularFire) {

  var url = 'https://my.firebaseio.com/myfirebase';
  $scope.xmatch = angularFire(new Firebase(url), $scope, 'xmatch');

}]);
}).call(this);

index.html

<!doctype html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
  <meta charset="utf-8">
  <title>test</title>
</head>
<body data-ng-app="ipremiosApp" data-ng-controller="GlobalCtrl">
  <!--[if lt IE 9]>
    <script src="bower_components/es5-shim/es5-shim.js"></script>
    <script src="bower_components/json3/lib/json3.min.js"></script>
  <![endif]-->

  <div class="main-body match-page" data-ng-controller="MatchCtrl">
    <div id="test" class="artist" data-ng-repeat="artist in xmatch.artists | orderBy: 'votes':true">
    {{artist.name}}
  </div>
</div>

<script src="bower_components/jquery/jquery.js"></script>
<script src="bower_components/angular/angular.min.js"></script>
<script src="https://cdn.firebase.com/v0/firebase.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.js"></script>
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_components/angular-fire/angularfire.js" type="text/javascript"></script>
<script src="scripts/app.js"></script>
<script src="scripts/controllers/global.js"></script>

</body>
</html>

【问题讨论】：

标签： javascript angularjs internet-explorer-8 firebase angularfire

【解决方案1】：

看起来this commit 中的 angularFire 中引入了一个错误，该错误仅影响 IE 8。我有filed an issue here。

问题源于 $scope.xmatch 在 angularFire() 初始化之前没有声明。在发布修复程序之前，您可以通过将其声明为空对象来解决此问题，如下所示：

new Firebase(url).child('test').set('happy');
$scope.xmatch = {};
angularFire(new Firebase(url), $scope, 'xmatch');

另外，顺便说一句，您的代码中有一个微妙的错误，可能会在以后给您带来麻烦。您不小心将 $scope.xmatch 设置为 angularFire 的返回值（一个承诺）：

// don't do this
$scope.xmatch = angularFire(new Firebase(url), $scope, 'xmatch');

这里似乎没有任何负面影响，因为在数据从 Firebase 到达并覆盖错误声明之前，您没有使用 $scope.xmatch 进行任何操作，但您当然不希望将该哈希设置为承诺价值:)

【讨论】：

谢谢。我会试试这个。并感谢您指出另一个错误。我知道那不完全是。