Javascript 使用AngularJS和ng存储的会话存储

我正在开发一个聊天应用程序。 我有下一个HTML：

我还与AngularJS合作，这是我的模块：

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

如您所见，我将ngStorage作为一个依赖项。 我正在尝试会话存储输入值，因此，如果用户意外刷新页面，他的名字仍然写在输入中，但我的代码不起作用，我该怎么办

更新

---

现在，多亏了Matt，我解决了我的疑问。

您需要将视图（在本例中为输入元素）绑定到模型中的值。您可以使用

ng model

执行此操作。例如：

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

---

如果要改为使用ngStorage作为绑定（而不是常规的$scope值），请在控制器中尝试以下操作：

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

在你的html中

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

---

---

基本上，你说的是；将

$sessionStorage

对象直接放在

$scope

上，以便视图可以引用它及其子对象。然后告诉

您希望它的值使用

ng model

引用该作用域上的特定子对象。因此，当您更改输入上的值时，它将更改范围模型值，这反过来将更新会话存储。

好的，我理解。但我觉得有些东西不见了。以下是我的疑问：1。用户进入我的页面并查看输入。2.他写他的名字。3.他不小心刷新了页面。4.即使如此，他的名字仍然写在输入上。这是我怀疑的一个很好的解释吗？比如，你担心你的例子会发生，还是不会发生？因为如果绑定到会话，则存储应该是持久的。如果你想删除它，你需要在某个时候手动清除它。我不希望发生这种情况。这是用西班牙语写的，但我想告诉你的是，当你在顶部或底部输入上写下你的名字时，模型会实现它，但是如果你刷新页面，你必须再次输入你的名字，它会工作的。我的页面现在有一个会话存储完全正常工作。谢谢马特澄清了我的疑问。

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