Question

我正在尝试实现三向绑定，并遇到一些问题。

用户可以在系统中添加三种不同类型的笔记（A，B，C），以下是我使用bindTo函数的方式，但是，当用户创建新笔记时，它会在用户点击时更新所有新笔记一种特定类型的笔记。即，当用户点击A类型下的添加注释时，然后单击B类型下的添加注释，它实际上会更改所有以前的新注释。

    $scope.addNote = function(noteType){

    $scope.addANote = false;
    $scope.addBNote = false;
    $scope.addCNote = false;

    var title = "A New Note";
    var content = "Adding Note here";
    var type = "New Type";

    var firebaseObj = new Firebase("https://XXXX/Notes");

    firebaseObj.push({ 
        title: title, 
        content: content,
        type: noteType,  
        username: username,
    });

    switch(noteType) {
        case 'A':
            $scope.addANote = true;
            break;
        case 'B':
            $scope.addBNote = true;
            break;
        case 'C':
            $scope.addCNote = true;
            break;
    } 

    // Get the note Key after user submit a new note
    var noteKey; 
    firebaseObj.on("child_added", function(snapshot, prevChildKey){
        noteKey = snapshot.key();
    }); 

    var ref = new Firebase("https://XXXX/Notes/" + noteKey);
    var syncNoteObj = $firebaseObject(ref);

    syncNoteObj.$bindTo($scope,"note").then(function(){
        console.log("threeway bingding:" + $scope.notes);
   });    
}

以下是视图中的代码：

                       <div id="navbar" class="navbar-collapse collapse">
                        <ul class="nav navbar-nav">
                          <li class="dropdown">
                            <a href="#">A <span class="caret"></span></a>
                            <ul class="dropdown-menu">
                              <li>            
                                <a href="#" onclick="return false;" ng-click="addNote('A')">New Note</a>
                              </li>
                            </ul>
                          </li>

                          <li class="dropdown">
                            <a href="#">B <span class="caret"></span></a>
                            <ul class="dropdown-menu">
                              <li>            
                                <a href="#" onclick="return false;" ng-click="addNote('B')">New Note</a>
                              </li>
                            </ul>

                          <li class="dropdown">
                            <a href="#">C <span class="caret"></span></a>
                            <ul class="dropdown-menu">
                              <li>            
                                <a href="#" onclick="return false;" ng-click="addNote('C')">New Note</a>
                              </li>
                            </ul>

所以我想知道bindTo（）函数中的两个参数是什么，我使用它错了吗？

Answer 1

所以，我想出来了！ :) 我只需要用当前注释取消绑定范围，这里是使用unbind的解决方案。

        syncNoteObj.$bindTo($scope,"note").then(function(unbind){
        console.log("threeway bingding:" + $scope.note);
        $scope.unbindFunction = unbind;
   });

    // Use a flag to track when to unbind the scope with database
    if($scope.unbindingFlag){
        $scope.unbindFunction();
    }
    else{
        $scope.unbindingFlag = true;
    }

bindTo（）如何在AngularFire中工作？

1 个答案: