Question

尝试从教程中创建一个简单的待办事项应用程序。我正在尝试使用ng-repeat将值从firebase显示到表中。无法检索“todo.activity”和“todo.notes”的值。这是我到目前为止的代码。

<div class="row" ng-controller="TodoCtrl">
    <div class="col-md-5">
        <h3>Add an activity</h3>
        <form ng-submit="addTodo()">
            <div class="form-group">
                <label for="activity">Activity</label>
                <input type="text" class="form-control" id="activity" ng-model="activity" placeholder="activity">
            </div>
            <div class="form-group">
                <label for="notes">Notes</label>
                <input type="text" class="form-control" id="notes" ng-model="notes" placeholder="activity">
            </div>

            <button type="submit" class="btn btn-default">Submit</button>
        </form>
    </div>
    <div class="col-md-7">
        <h3>Todo List</h3>
        <table class="table table-striped">
            <thead>
                <tr>
                    <th>Activity</th>
                    <th>Notes</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="todo in todos">
                <td>{{todo.activity}}</td>
                <td>{{todo.notes}}</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

todo.js

'use strict';
    // Initialize Firebase
    var config = {
      apiKey: "AIzaSyAfjQC4qL7tMu37XA2z469jfLCrsMsHdAM",
      authDomain: "todo-5a1c3.firebaseapp.com",
      databaseURL: "https://todo-5a1c3.firebaseio.com",
      storageBucket: "todo-5a1c3.appspot.com",
      messagingSenderId: "636959211631"
    };
    firebase.initializeApp(config);
angular.module('myApp.todo', ['ngRoute'])
.config(['$routeProvider', function($routeProvider) {
  $routeProvider.when('/todo', {
    templateUrl: 'todo/todo.html',
    controller: 'TodoCtrl'
  });
}])

.controller('TodoCtrl', ['$scope','$firebaseArray',function($scope,$firebaseArray) {

  var rootRef = firebase.database().ref();
  $scope.todos = $firebaseArray(rootRef.child('todos'));
  $scope.addTodo = function(){
    console.log("adding contact");

    $scope.todos.$add({
      activity: $scope.activity,
      notes   : $scope.notes
    }).then(function(rootRef){
      var id = rootRef.key;
      console.log('Added Contant '+id);
      $scope.activity = '';
      $scope.notes = '';
    });
  }

}]);

Angular：无法显示来自firebase的数据

0 个答案: