Angularjs AngularFire添加到数组将清除$scope变量

当我向嵌套的AngularFire$asArray（）对象添加某些内容时，我遇到了一个奇怪的问题。不知道如何解释它而不粘贴我所有的代码，所以请容忍我

我的模板如下：

<ion-content ng-controller='WorkoutCtrl as workoutCtrl' data-ng-init="init()">
  <div ng-hide="workoutCtrl.isExercising" class="card">
    <label class="item item-input">
      <input ng-enter="createExercise(newExercise)" ng-model="newExercise" type="text" placeholder="Type exercise here...">
    </label>
  </div>
  <div ng-click="startExercise()" class="card" ng-controller="ExerciseCtrl" ng-repeat="exercise in exercises" data-ng-init="init()">
    <div class="item item-divider">
      {{ exercise.name }}
    </div>
    <div class="item item-text-wrap">
      <button class="button" ng-click="createSet()" ng-show="exercise.isActive">
        Tap to add set
      </button>
    </div>
    <div class="item item-divider" ng-show="exercise.isActive">
      <button class="button icon ion-minus-circled" ng-click="addReps(-1)"></button>
      {{ exercise.numReps + ' reps' }}
      <button class="button icon ion-plus-circled" ng-click="addReps(1)"></button>
      <div class="range">
        <input type="range" name="volume" min="1" max="10" ng-model="exercise.numReps">
      </div>
    </div>
  </div>
  <div class="card bottom-btn-wrapper">
    <button ng-hide="workoutCtrl.isExercising" class="button button-block button-positive done-workout">
      I'm done working out!
    </button>
    <button ng-show="workoutCtrl.isExercising" ng-click="finishExercises()" class="button button-block button-positive done-exercise">
      Finish Exercise
    </button>
  </div>
</ion-content>

{{exercise.name}
点击以添加一组
{{exercise.numReps+'reps'}
我锻炼完了！
完成练习

这是我的控制器：

controllers.controller('WorkoutCtrl', [
  '$scope',
  'FirebaseUrl',
  '$firebase',
  function ($scope, FirebaseUrl, $firebase) {
    var self = this;
    var fireRef;

    $scope.init = function () {
      self.isExercising = false;
      self.workoutId = 1;
      fireRef = new Firebase(FirebaseUrl + '/workouts/' + self.workoutId);

      $firebase(fireRef).$update({ date: new Date() });
      $scope.exercises = $firebase(fireRef.child('exercises')).$asArray();
    };

    $scope.createExercise = function (name) {
      $scope.newExercise = '';
      $scope.exercises.$add({ name: name });
    };

    $scope.finishExercises = function () {
      angular.forEach($scope.exercises, function (exercise) {
        exercise.isActive = false;
      });
      self.isExercising = false;
    };
  }
]);

controllers.controller('ExerciseCtrl', [
  '$scope',
  'FirebaseUrl',
  '$firebase',
  function ($scope, FirebaseUrl, $firebase) {
    var fireRef;

    $scope.init = function () {
      fireRef = new Firebase(FirebaseUrl + '/workouts/' + $scope.workoutCtrl.workoutId + '/exercises/' + $scope.exercise.$id + '/sets');

      $scope.exercise.isActive = false;
      $scope.exercise.numReps = '8';
      $scope.exercise.sets = $firebase(fireRef).$asArray();
    };

    $scope.startExercise = function () {
      $scope.finishExercises();
      $scope.exercise.isActive = true;
      $scope.workoutCtrl.isExercising = true;
    };

    $scope.addReps = function (repsToAdd) {
      var reps = parseInt($scope.exercise.numReps) + repsToAdd;

      if (reps > 0 && reps < 100) {
        $scope.exercise.numReps = reps.toString();
      }
    };

    $scope.createSet = function () {
      $scope.exercise.sets.$add({reps: $scope.exercise.numReps});
    };
  }
]);

controllers.controller（'WorkoutCtrl'[
“$scope”，
“FirebaseUrl”，
“$firebase”，
函数（$scope，FirebaseUrl，$firebase）{
var self=这个；
var fireRef；
$scope.init=函数（）{
self.isExercising=false；
self.workoutId=1；
fireRef=新的Firebase（FirebaseUrl+'/workouts/'+self.workoutId）；
$firebase（fireRef）。$update（{date:new date（）}）；
$scope.exercises=$firebase（fireRef.child（'exercises'））。$asArray（）；
};
$scope.createExercise=函数（名称）{
$scope.newExercise=''；
$scope.exercises.$add（{name:name}）；
};
$scope.finishExercises=函数（）{
角度.forEach（$scope.exercises，function（exercise）{
exercise.isActive=false；
});
self.isExercising=false；
};
}
]);
controllers.controller（'ExerciseCtrl'[
“$scope”，
“FirebaseUrl”，
“$firebase”，
函数（$scope，FirebaseUrl，$firebase）{
var fireRef；
$scope.init=函数（）{
fireRef=新的Firebase（FirebaseUrl++'/workouts/'+$scope.workoutCtrl.workoutId++'/exerces/'+$scope.exercise.$id++'/sets'）；
$scope.exercise.isActive=false；
$scope.exercise.numReps='8'；
$scope.exercise.sets=$firebase（fireRef）。$asArray（）；
};
$scope.startExercise=函数（）{
$scope.finishExercises（）；
$scope.exercise.isActive=true；
$scope.workoutCtrl.isExercising=true；
};
$scope.addReps=函数（repsToAdd）{
var reps=parseInt（$scope.exercise.numReps）+repsToAdd；
如果（重复次数>0&&reps<100）{
$scope.exercise.numReps=reps.toString（）；
}
};
$scope.createSet=函数（）{
$scope.exercise.sets.$add（{reps:$scope.exercise.numReps}）；
};
}
]);

---

我遇到的问题是当我单击调用createSet（）方法的按钮时。这成功地在我的Firebase数据库中创建了一个新对象，但由于某种原因，

$scope.exercise.isActive

和

$scope.numReps

不再有值。有什么线索吗？

我怀疑问题在于服务器上的更新没有您的

isActive

和

numReps

显示属性

WorkoutCtrl以Firebase数组的形式获取一组初始练习对象，监视整个练习数据树

ExerciseCtrl针对一个练习对象进行初始化，在练习记录上添加Firebase以外的本地属性（

isActive

，

numReps

）

ExerciseCtrl.createSet（）通过exercise.sets.$add（）更新练习记录。您似乎指望服务器只为集合列表提供更新

但是，服务器也会将更新推送到WorkoutCtrl.exercises数组，因为其中一个练习已更改

对exercise的更新将清除您在exerceCtrl范围内本地添加的属性

您可以通过在exercises数组上使用并观察更新何时返回来验证这一点

通过在原始数据记录上返回自定义包装器对象，我解决了类似的问题。连接起来需要做一点工作，但它提供了很大的自由来添加未存储在Firebase中的UI行为建模。WidgetFactory示例与您需要的非常接近