使用AngularJS和ng-storage進行會話存儲

我正在開發一個聊天應用程序。我的下一個HTML：使用AngularJS和ng-storage進行會話存儲

<input type='text' id='nameInput' placeholder='Your Name'>

我還與AngularJS的工作，這是我的模塊：

var app = angular.module('principal', ['ngStorage']); 
app.controller('MainCtrl', function($scope, $sessionStorage) { 
    $scope.$storage = $sessionStorage.$default(#nameInput); 
});

正如你所看到的，我有ngStorage作爲一個依賴。我想sessionStorage的輸入值，所以如果用戶意外刷新頁面，他的名字仍然寫在輸入，但我的代碼不起作用，我能做什麼？

UPDATE 現在，謝謝馬特，我解決了我的疑問。

來源

2015-10-18 Pablo Ivan

您需要將您的視圖（本例中爲輸入元素）綁定到模型中的值。你使用ng-model來做到這一點。例如：

<input type="text" ng-model="state.nameInput" placeholder="Your Name">

然後你只需要在你的控制器中設置你的範圍。

$scope.state = { 
    nameInput: 'John' 
};

如果你想，而不是想用ngStorage作爲綁定（而不是常規的$範圍值），嘗試在你的控制器中的以下內容：

$scope.$storage = $sessionStorage.$default(/* any defaults here */);

而在你的HTML

<input type="text" ng-model="$storage.nameInput" placeholder="Your Name">

基本上，你是什麼卅一ng是;將$sessionStorage對象直接放在$scope上，以便該視圖可以引用它及其子。然後你告訴<input>你希望它的價值是使用ng-model引用該範圍上的某個特定的孩子。因此，當您更改輸入值時，它將更改範圍模型值，從而更新會話存儲。

來源

2015-10-18 04:29:03

好的，我明白了。但我認爲缺少一些東西。這是我更加解釋的疑問： 1.用戶進入我的頁面並看到輸入。 2.他寫下他的名字。 3.不小心刷新了頁面。 4.即使如此，他的名字仍然寫在輸入中。這是對我懷疑的一個很好的解釋嗎？ –

在你擔心你的例子會發生，還是不會發生？因爲如果你將綁定到會話存儲是應該堅持。如果你想刪除它，你需要在某個時候手動清除它。 –

我不想發生。 –

使用AngularJS和ng-storage進行會話存儲

回答

相關問題