Question

我想在bootstrap模式中显示用户填写的最后一个输入数据，我尝试使用HTML autocomplete =＆＃34; on＆＃34;属性但失败了，就像在这个小提琴中完成的那样。

用户点击提交后，第二次根据之前填写的输入值显示提示。

http://bootsnipp.com/snippets/featured/login-form-in-a-modal

http://jsfiddle.net/KyleMit/0fscmf3L/

现在我使用jQuery自动完成方法，但是我们必须将数组作为源传递。见以下示例

https://jqueryui.com/autocomplete/

假设我使用ng-model等保存文本输入并将数据保存在$ rootScope或scope中，然后刷新浏览器，那么范围将消失。

Answer 1

假设我使用ng-model等保存文本输入并将数据保存在$ rootScope或scope中，然后我刷新浏览器，那么范围将消失。

正如您自己所说，这些值不会在整个应用程序中持续存在，因为您需要将值存储在数据库或会话变量中。例如。

完成此操作后，您可以将数组传递给您的js代码，如下所示。

$(function () {
    var availableTags = GetTags(); // GetTags() would be the method that gets your saved inputs.
    $("#tags").autocomplete({
        source: availableTags
    });
});

Answer 2

代码已更新 我想你正在使用第二种方法，即使用角度js：我们可以将用户输入存储到浏览器cookie中并从中读取。以下是使用角度cookie的文档：（https://docs.angularjs.org/api/ngCookies/service/ $饼干）

以下是更新的代码：

var myapp = angular.module('myApp', ['ngCookies']);
var PageController = function($scope, $cookieStore) {
$scope.cookieList = $cookieStore.get('textName') || [];
$scope.storeDataToCookie = "";
$scope.totalCookie = 0;
$scope.getCookieList = function() {
    var arr = [];
    arr = $cookieStore.get("textName");
    $scope.cookieList = arr;
    $scope.totalCookie = $cookieStore.get("textName").length;
};
$scope.storeCookieData = function() {
    var array = $cookieStore.get('textName');
    if (array == null) {
        array = [];
    }
    array.push($scope.storeDataToCookie);
    $cookieStore.put('textName', array);
    $scope.cookieList = array;
    $scope.totalCookie = $cookieStore.get("textName").length;
};
$scope.deleteCookieData = function() {
    $cookieStore.remove('textName');
    $scope.cookieList = $cookieStore.get('textName') || [];
    $scope.totalCookie = 0;
};
$scope.retrieveCookieData = function() {
    //
    $scope.totalCookie = $cookieStore.get("textName").length;
};
}
myapp.controller('CookieTestController', PageController);

HTML：

<div ng-app="myApp">
    <div data-ng-controller="CookieTestController">
        <input type="text" ng-model="storeDataToCookie" />
        <input type="button" ng-click="storeCookieData()" value="Save Cookie Data" />
        <input type="button" ng-click="retrieveCookieData()" value="Retrieve Cookie Data" />
        <input type="button" ng-click="deleteCookieData()" value="Delete Cookie Data" />
        <input type="button" ng-click="getCookieList()" value="List Cookies" />
        <br />
        <span>Total Cookies:<strong>{{totalCookie}}</strong></span>
        <p>List of cookie values:</p>
        <ul>
            <li ng-repeat="c in cookieList">
                {{c}}
            </li>
        </ul>
    </div>
</div>

以下是Plunker： Plunker

bootstrap模态

2 个答案: