5

以下のコントローラーは、ビューにテーブルとフォームをフィードします。表の関連部分は次のとおりです。

<tr ng-repeat="obj in tab.col | filter:filterObj" ng-click="select(obj)" ng-class="isSelected(obj)">

行をクリックすると、フォームに obj (モデルは tab.obj) の詳細が表示され、編集できます。ユーザーがフォーム フィールドで obj を変更すると、テーブルは適切に更新されますが、firebase は更新を取得せず、新しいオブジェクトの追加を取得します (これは array.push(obj) で行われます)。

define(['app'], function(app) {
app.controller('LinksCtrl',['$scope', '$filter', '$http','angularFire','angularFireAuth', function($scope,$filter,$http, angularFire, angularFireAuth) {
$scope.links = {};
$scope.tabs = [];

var url = "https://<url>.firebaseio.com/links";
angularFireAuth.initialize(url, {scope: $scope, name: "user", path: "/"});
var promise = angularFire(url, $scope, 'links', {})

$scope.select = function (item) {
  for(i in $scope.tabs) {
    var tab = $scope.tabs[i];
    if (tab.active) {
      tab.obj = item;
      if (tab.obj.selected) {
        tab.obj.selected = ! tab.obj.selected;
      } else {
        tab.obj.selected = true;
        // $scope.$apply();
      }
    }
  }
};

$scope.isSelected = function(obj) {
  if (obj.selected && obj.selected === true) {
   return "active"; 
  }
  return "";
}


promise.then(function() {

  $scope.tabs.push({
    title: 'links',
    disabled: false,
    active: false,
    col: $scope.links.open, //this is an array of objects
    obj: {}
  });

  $scope.tabs[0].active = true;

  for(i in $scope.tabs) {
    var tab = $scope.tabs[i];
    tab.actions = app.actions();

    // app.actions returns an array with more objects like the following doing CRUD and other basic stuff
    tab.actions.push({
      name: 'Delete link',
      icon: 'icon-minus',
      cond: function(tab) { if ('selected' in tab.obj) { return tab.obj.selected}; return false; },
      func: function(tab) {
        // splice tab.col or whatever modification
      }
    });
  };
});
  }]);

});

どうすればこのようなものを作ることができますか? コレクションを介して手動で同期する必要がありますか? console.log を使用したデバッグは、オブジェクト obj がコードのすべての段階で持つべきものを持っていることを示しています (プロトタイプ、ハッシュコードなどがあります)。

アップデート：

私はうまくいく解決策を持っています。それはバインディングの問題か、そのようなものだと思われますが、何が起こっているのかわかりません。tabs[i].col = $scope.links.i の割り当てが原因のようです (この場合は i = 'open' :-? です。角度の私の使用法かもしれません。

controller scope ------

    // get the firebase data and store it in 
    var promise = angularFire(url, $scope, 'links', {})

    // build the tabs structure, where tabs[i].col = $scope.links.i

    // build actions for each tab

    // create an empty tabs[i].obj to use in the form model

ng-repeat scope -------

    // iterate over the tab structure
    <tab ng-repeat="tab in tabs" heading="{{tab.title}}" active="tab.active" disabled="tab.disabled">

ng-repeat scope --------

    // Iterate over the elements, so we can select one, and edit it, updating firebase
    // If we iterate over tab.col, firebase does not get the updates, but If we iterate over
    // the original $scope.links variable, it works as expected

    <tr ng-repeat="obj in links[tab.title] | filter:filterObj | orderBy: 'date':true" ng-click="select(obj)" ng-class="isSelected(obj)">
4

1 に答える 1

1

私はうまくいく解決策を持っています。それは私の側の拘束力のある問題のようです。tabs[i].col = $scope.links.i の割り当てが原因のようです (この場合は i = 'open' :-? です。角度の私の使用法かもしれません。

解決策は、tabs[i].col を使用する代わりに $scope.links を使用することです。つまり、$scope 変数への参照の代わりに $scope 変数を使用します。

controller scope ------

    // get the firebase data and store it in 
    var promise = angularFire(url, $scope, 'links', {})

    // build the tabs structure, where tabs[i].col = $scope.links.i

    // build actions for each tab

    // create an empty tabs[i].obj to use in the form model

ng-repeat scope -------

    // iterate over the tab structure
    <tab ng-repeat="tab in tabs" heading="{{tab.title}}" active="tab.active" disabled="tab.disabled">

ng-repeat scope --------

    // Iterate over the elements, so we can select one, and edit it, updating firebase
    // If we iterate over tab.col, firebase does not get the updates, but If we iterate over
    // the original $scope.links variable, it works as expected

    <tr ng-repeat="obj in links[tab.title] | filter:filterObj | orderBy: 'date':true" ng-click="select(obj)" ng-class="isSelected(obj)">
于 2014-08-18T11:36:24.720 に答える