Question

我们的团队正在ServiceNow中开发一个调查表小部件，并希望在用户完成调查表而不重新加载整个页面后出现一个特定的div。

整个代码相当冗长，但这是在提交问卷后应显示的特定div：

<div align="center" ng-if="taskCompleted == true" class="infoDiv">
          <div class="mainTitle first">Task Complete!</div>
          <div class="subTitle second" style="max-width: 600px;">This task was completed on: {{params.taskCompleteDate.split(" ")[0]}}</div>
          <!-- Add section to indicate they can review their answers here-->
          <div align="left" style="margin-top: 40px; font-size: 16px; color: #979797;">
            Review Completed Questionnaire Below:
          </div>
          <div style="height: 500px; overflow-y: scroll; margin-top: 10px; border: 1px solid #eeeeee; border-radius: 2px;" align="left">
            <div ng-repeat="item in completedQuest track by $index" style="padding-top: 5px; padding-bottom: 20px; padding-left: 15px; min-width: 400px; border-bottom: 1px solid #eeeeee; margin-bottom: 10px;" ng-if="item.ans">
              <table>
                <tr>
                  <td rowspan="2" style="color: #979797; padding-right: 15px; cursor: pointer;" ng-click="editQuestionFnct(item.quest_id)"><span class="glyphicon glyphicon-pencil" title="Edit Answer" style="padding-right: 5px;"></span></td>
                  <!--<td rowspan="2" style="color: #979797; padding-right: 15px; cursor: pointer;" ng-click="showPrerenderedDialog2('#editQuestion', item.quest_id)"><span class="glyphicon glyphicon-pencil" title="Edit Answer" style="padding-right: 5px;"></span></td>-->
                  <td style="color: #336796;"><span class="glyphicon glyphicon-question-sign" title="Question mark icon" style="padding-right: 5px;"></span></td>
                  <td><span style="color: #717171;">{{item.quest}}</span></td>
                </tr>
                <tr>
                  <td style="padding-top: 10px; color: green;"><span class="glyphicon glyphicon-ok-circle" title="Check mark icon" style="padding-right: 5px;"></span></td>
                  <!--<td style="padding-top: 10px;"><span style="color: black;">{{item.answer}}</span></td>-->
                  <td style="padding-top: 10px;"><span style="color: black;">{{item.ans}}</span></td>
                </tr>
              </table>
            </div>
          </div>
        </div>

现在，当用户填写问卷后，他们将看到一条通用的“谢谢”消息：

<div style="padding-bottom: 25px;" ng-if="params.finishQs" ng-class="params.questClass">
          Thank you for your responses!
</div>

并且需要按ctrl -r刷新页面才能查看上述允许他们编辑答案的div。有没有什么办法可以使该div出现而无需重新加载整个页面？我对angularjs很陌生，因此任何建议/建议都对您有所帮助，谢谢！

Answer 1

表格填写完毕后

$scope.taskCompleted = true;

或者您可以使用html

<button ng-click="taskCompleted=true;">Complete</button>

P.S。我建议不要使用表达式{{}}。而是使用ng-bind以获得更好的性能。

AngularJS-在不重新加载页面的情况下重新加载div

1 个答案: