angularJS将选定的值带到下一页答案

【问题标题】：angularJS carry selected value to next pageangularJS将选定的值带到下一页
【发布时间】：2014-10-23 16:35:59
【问题描述】：

嘿，我有两个 JSP 页面，它们是表单的第 1 步和第 2 步。在第 1 步中，我正在显示用户可以选择的某些类别选项。为了让用户进入第 2 步，他们必须单击其中一个类别选项，然后在进入第 2 步时，我试图显示他们单击的类别的名称。我知道使用 ng-model，可以将其绑定到输入并显示在该输入中交互的内容，但由于某种原因，如果我将 ng-model 绑定到“p”或“span”，它就无法工作。我是 AngularJs 的新手，所以请避免任何新手错误。

step_one.jsp

<div class="col-sm-6" ng-click="setStep(2)"><span class="glyphicon glyphicon-cutlery"></span>
       <p ng-model="category">Cutlery &#38; Service</p>
</div>

step_two.jsp

<div class="col-md-12">
            <label for="requestCategory">Category:</label>
            <p id="requestCategory" ng-model="category">{{category}}</p>
        </div>

JS切换步骤：

 $scope.setStep = function (step){
        $scope.step = step;
    };

    $scope.isStepSet = function(step){
        return ($scope.step === step) ;
    };

【问题讨论】：

标签： angularjs angularjs-directive angular-ngmodel

【解决方案1】：

您是否在混合服务器与客户端开发？

您有 2 个 JSP，我假设每个都加载 AngularJS？大多数 Angular 应用程序使用单个页面（即一个 JSP）并动态加载/显示不同的内容（即通过角度视图）。单页应用程序 (SPA) 在单页中维护状态，Angular 提供了使用 $scope 执行此操作的结构（您也可以使用 localStorage 执行此操作）。

您似乎正在从经典的 Web/服务器端开发模型过渡到客户端模型。要执行上述操作，您可以将所有内容保存在 1 个 JSP 中并使用以下代码：

HTML

<div ng-show="isStepSet(1)" ng-init="setStep(1)" class="col-sm-6" ng-click="setStep(2)"><span class="glyphicon glyphicon-cutlery"></span>
    <p ng-model="category">Cutlery &#38; Service</p>
</div>

<div ng-show="isStepSet(2)" class="col-md-12">
    <label for="requestCategory">Category:</label>
    <p id="requestCategory" ng-model="category">{{category}}</p>
</div>

【讨论】：