Angularjs 方式，有条件地生成新表单并将其附加到页面或状态更改答案

【问题标题】：Angularjs way, conditionally to generate new form and append it to the page or state changeAngularjs 方式，有条件地生成新表单并将其附加到页面或状态更改
【发布时间】：2017-03-29 22:22:18
【问题描述】：

我是 angularjs 的新手，并且想知道完成有条件地生成或显示表单等任务的 angularjs 方式是什么？让我们说

$scope.counter = function(){
   if ($scope.years < 5){

    // what is here? append or should  return true and use ng-if directive in html?

    }}

谢谢

【问题讨论】：

标签： angularjs angular-ui-router angularjs-ng-repeat

【解决方案1】：

var myApp = angular.module('myApp',[]);

myApp.controller('ctrl', ['$scope', function($scope) {
  $scope.years = 10;
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="ctrl">
<label>age :</label>
  <input type="number" ng-model="years">
  <div ng-if="years<5"> show if years < 5 </div>
  <div ng-if="years>5"> show if years > 5 </div>
</div>

就这样

【讨论】：

谢谢，唯一的事情，你会建议将用户带到另一个包含表单的状态视图，还是首选指令的方式？
我不了解你所有的应用程序，但是动态生成相同状态的表单是个好主意，如果你的表单很大，你也可以使用向导表单
喜欢embed.plnkr.co/M03tYgtfqNH09U4x5pHC/preview（或谷歌上的其他“wizard form angularjs”）
感谢您的帮助和建议。

【解决方案2】：

理想情况下，您应该通过 ng-if\ng-show\ng-hide 指令从 HTML 文件中执行此操作。

如下所示（years 应该是控制器\组件的一部分）：

<div ng-if="years<5"> html code </div>

【讨论】：