Javascript angularjs表单输入建议

我对angularjs中的表单有问题

经典html和php示例

    <form name="myForm" action="post.php" method="post" autocomplete="on">
        <input name="namename" type="text" />
        <input name="email" type="text" />

        <input name="submit" type="submit" value="submit" />
    </form>

这和预期的一样。在第二次访问中，在我第一次提交表单之后，我只需要键入第一个字母，输入字段将根据第一篇文章给出一些建议

在角度上相同的形式

    <form name="myForm" ng-submit="test(user)" autocomplete="on">
        <input name="name" type="text" ng-model="user.name" autocomplete="given-name" />
        <input name="email" type="text" ng-model="user.email" />

        <input name="submit" type="submit" value="submit" />
    </form>

在第二次访问这里时，表格将毫无提示，这非常令人恼火

有没有解决办法

范例

---

提前感谢。

您所描述的行为是由浏览器完成的，并不保证在所有情况下都有效。用AngularJS实际上很容易做到；只需跟踪共享状态对象。这可以通过几种方式完成，最简单的方法是使用以下方法：

// Create an injectable object with the name 'userInput'
angular.module('myApp').value('userInput', {});

angular.module('myApp').controller('MyController', function($scope, userInput) {
  // Assign the state object to the scope so it's available for our view
  $scope.user = userInput;
});

现在，将此对象注入正在处理表单的控制器，如下所示：

// Create an injectable object with the name 'userInput'
angular.module('myApp').value('userInput', {});

angular.module('myApp').controller('MyController', function($scope, userInput) {
  // Assign the state object to the scope so it's available for our view
  $scope.user = userInput;
});

按原样渲染表单，您将看到表单的状态保持不变。事实上，在使用Angular编程时，这是一个隐藏的宝石，因为它允许您保留非常复杂的状态信息，而这在以前是非常不切实际的

编辑 让自动完成工作的一种方法是维护数据列表元素。只需将先前输入的值存储在数组中，并使用

ng repeat

渲染所有选项。使用

list

属性将输入元素与数据列表相关联，就可以开始了

<input list="nameHistory" type="text" ng-model="user.name" />

<datalist id="nameHistory">
  <option ng-repeat="item in userHistory.name" value="{{ item }}"></option>
</datalist>

---

您所描述的行为是由浏览器完成的，并不保证在所有情况下都有效。用AngularJS实际上很容易做到；只需跟踪共享状态对象。这可以通过几种方式完成，最简单的方法是使用以下方法：

// Create an injectable object with the name 'userInput'
angular.module('myApp').value('userInput', {});

angular.module('myApp').controller('MyController', function($scope, userInput) {
  // Assign the state object to the scope so it's available for our view
  $scope.user = userInput;
});

现在，将此对象注入正在处理表单的控制器，如下所示：

// Create an injectable object with the name 'userInput'
angular.module('myApp').value('userInput', {});

angular.module('myApp').controller('MyController', function($scope, userInput) {
  // Assign the state object to the scope so it's available for our view
  $scope.user = userInput;
});

按原样渲染表单，您将看到表单的状态保持不变。事实上，在使用Angular编程时，这是一个隐藏的宝石，因为它允许您保留非常复杂的状态信息，而这在以前是非常不切实际的

编辑 让自动完成工作的一种方法是维护数据列表元素。只需将先前输入的值存储在数组中，并使用

ng repeat

渲染所有选项。使用

list

属性将输入元素与数据列表相关联，就可以开始了

<input list="nameHistory" type="text" ng-model="user.name" />

<datalist id="nameHistory">
  <option ng-repeat="item in userHistory.name" value="{{ item }}"></option>
</datalist>

---

只需将此属性添加到输入标记

autocomplete=“off”

只需将此属性添加到输入标记

autocomplete=“off”

谢谢您的回答，但这不是我的意思。我不想保存表单的状态。每个Broser都有一个内置表单自动填充常见输入字段（如用户名等）的历史记录。这正是我想要使用的，但chrome仅在表单实际执行post时保存此自动填充数据，这不是由angular完成的。我在上面的帖子中添加了一张图片。哦，我的错：S。。。我已经用一个可能的解决方案更新了答案，并加入了一个免费的plunker演示。谢谢你的回答，但这不是我的意思。我不想保存表单的状态。每个Broser都有一个内置表单自动填充常见输入字段（如用户名等）的历史记录。这正是我想要使用的，但chrome仅在表单实际执行post时保存此自动填充数据，这不是由angular完成的。我在上面的帖子中添加了一张图片。哦，我的错：S。。。我已经用一个可能的解决方案更新了答案，并加入了一个免费的plunker演示。感谢您提供答案！你能再补充一点细节吗？谢谢你的回答！你能再补充一点细节吗？