Question

嘿，我有两个JSP页面，分别是步骤1＆amp; 2表格。在步骤1中，我显示了用户可以选择的某些类别选项。为了让用户进入第2步，他们必须单击其中一个类别选项，然后转到第2步，我将尝试显示他们单击的类别的名称。我知道使用ng-model，可以将它绑定到输入并显示在该输入中交互的内容但是由于某种原因，如果我将ng-model绑定到＆＃34; p＆＃34;或＆＃34; span＆＃34;。我是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) ;
    };

Answer 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>

angularJS将选定值带到下一页

1 个答案: