Question

大家好我们都在尝试使用angular和firebase进行一些很酷的3路绑定动作，但是我遇到了一些绑定问题。在绑定到一起之前，我真的不知道对象（$ scope和$ firebase）应该是什么样子。现在，如果我通过firebase进行更改，我几乎可以立即看到我的DOM中的更改，但是我需要能够从DOM到FB做一些真正的3路绑定。也许我这样做完全错了。：/

这就是我所拥有的：

html（这会创建一个基于我的$ scope.myGrid的400个方格的巨大网格，这是一个引用$ firebase对象的$ scope对象）

<div class="square" ng-repeat="(position, hex) in myGrid" style="background-color:{{hex}}" ng-click="squareClick({{position}})">

我的Controller（匿名fxn生成我的$ scope.myGrid对象。）

$scope.paletteColor = "#f00";


    //FIREBASE
    var ref = new Firebase("https://MyAPP.firebaseio.com/");
    //angularfire ref to the data
    var sync = $firebase(ref);
    //download the data into a local object
    var syncObject = sync.$asObject();
    console.log(syncObject); // firebase object is composed of root node with 400 child nodes with key:value like 01-01:"#f00", 01-02: "#ff0" which is exactly how my $scope.myGrid object looks like
    $scope.myGrid = syncObject;

// binding Part taken from the docs which is a huge mystery to me.
//        syncObject.bindTo($scope, "myGrid").then(function(){
//            console.log($scope.myGrid);
//            $scope.myGrid. = "baz";
//            ref.$set({foo:"baz"});
//        });

Answer 1

您需要使用注释中列出的syncObject.bindTo语法。这设置了三向绑定。请参阅以下官方文档中的此说明：

虽然3向绑定非常方便，但要小心尝试将它们用于深层嵌套的树结构。坚持实际用途，比如同步键值对。

如果您需要比基本键值对更多的功能，您可能需要考虑扩展Firebase工厂。您可以在https://www.firebase.com/docs/web/libraries/angular/guide.html#section-extending-factories的文档中找到它。

我是否正确绑定了angularfire（angular + firebase）？

1 个答案: