我的AngularFire/AngularJS項目中的一次擊鍵後，Firebase讓我停止打字

我開始使用Firebase（AngularFire）爲我的應用程序同步我的數據。這是一款適用於Scrum的卡片工具，可以將卡片添加到數組中。您可以操縱輸入字段。我的AngularFire/AngularJS項目中的一次擊鍵後，Firebase讓我停止打字

首先我使用localStorage，它工作得很好。現在我基本上已經實現了Firebase，但我遇到了以下問題：在一個字段中輸入單個鍵後，應用程序停止並且只有在輸入字段中再次單擊才能恢復鍵入。

你知道這是爲什麼嗎？非常感謝您提前！

這是我的基本實現，我控制器：

Card = (@color, @customer, @points, @number, @projectName, @story) -> 

     $scope.cards = [] 
     reference = new Firebase("https://MYACCOUNT.firebaseio.com/list") 
     angularFire(reference, $scope, "cards") 

     $scope.reset = -> 
      $scope.cards = [] 

     $scope.addCardRed = (customer) -> 
      $scope.cards.push new Card("red", customer)

這就是我的標記：

<div class="card card-{{ card.color }}"> 
    <header> 
     <input class="points" contenteditable ng-model="card.points"></input> 
     <input class="number" placeholder="#" contenteditable ng-model="card.number"></input> 
     <input class="customerName" contenteditable ng-model="card.customer.name"></input> 
     <input class="projectName" placeholder="Projekt" contenteditable ng-model="card.projectName"></input> 
    </header> 
    <article> 
     <input class="task" placeholder="Titel" contenteditable ng-model="card.task"></input> 
     <textarea class="story" placeholder="Story" contenteditable ng-model="card.story"></textarea> 
    </article> 
    <footer> 
     <div class="divisions"> 
      <p class="division"></p> 
      <button ng-click="deleteCard()" class="delete">X</button> 
     </div> 
    </footer> 
</div> 
<div class="card card-{{ card.color }} backside"> 
    <article> 
     <h2 class="requirement">Requirements</h2> 
     <textarea class="requirements" placeholder="Aspects" contenteditable ng-model="card.requirements"></textarea> 
    </article> 
</div>

來源

2013-10-19 christophe

此標記包含在指令中嗎？如果不是，$ scope.card指定在哪裏？ – bennlich

p.s.我的第一個猜測是，這實際上是http://stackoverflow.com/questions/15119086/angular-js-cant-edit-dynamically-created-input-fields（也許令人驚訝的與Firebase/AngularFire無關！）的副本。 – bennlich

是的，它是在一個重複的「卡片卡」中。 – christophe

我碰到了這一點。這是因爲它正在重新計算整個數組。以下是我固定它：

綁定您的輸入到ng-model，並添加此focus指令

<input class="list-group-item" type="text" ng-model="device.name" ng-change="update(device, $index)" ng-click="update(device, $index)" ng-repeat='device in devices' focus="{{$index == selectedDevice.index}}" />

我設置selectedDevice這樣

$scope.update = function(device, index) { 
    $scope.selectedDevice = device 
    $scope.selectedDevice.index = index 
}

現在創建這個指令。

angular.module('eio').directive("focus", function() { 
    return function(scope, element, attrs) { 
    return attrs.$observe("focus", function(newValue) { 
     return newValue === "true" && element[0].focus(); 
    }); 
    }; 
});

更新對不起慢了，有一些事情傾向於。

這樣做的原因是因爲它不斷地在當前選擇的數組中保存項目的索引值。一旦焦點丟失，通過轉到該索引立即返回焦點。

但是，如果我們正在討論多個數組，那麼您需要重構setSelected代碼來說明它是哪個數組。

所以，你會想改變

focus="{{$index == selectedDevice.index}}"

喜歡的東西

focus="{{$index == selectedDevice.index && selectedDevice.kind == 'points'}}"

哪裏points是哪裏出現的代碼數組的範疇。

來源

2013-10-20 20:11:40

很明顯，我在哪裏''設備''你想''卡':) –

嘿！非常感謝你的解決方案！它適用於一種輸入，但不適用於所有！我怎樣才能調整這個代碼在我得到的每個輸入字段中工作？我將在底部發布我目前的標記。如果你能回答這個問題，那會很棒！ :) – christophe

任何人都可以回答這個問題嗎？ – christophe

我通過下載最新版本的angularFire.js對這一項進行了排序，看起來像是bower安裝的那個，沒有這個修復。現在我的內容可以編輯！

來源

2013-11-05 13:25:59 irth

我的AngularFire/AngularJS項目中的一次擊鍵後，Firebase讓我停止打字

回答

相關問題