在输入字段中输入值后如何显示跨度？角 JS答案

【问题标题】：How to display the span once the value is entered in input field? Angular JS在输入字段中输入值后如何显示跨度？角 JS
【发布时间】：2016-09-08 02:09:09
【问题描述】：

我在控制器中定义了一个范围变量，最初我的范围变量的值为空。

我将 ng-model 绑定到输入字段，并将 ng-show 添加到需要显示的跨度中，一旦在输入字段中输入值。

当我在输入字段中输入值时，没有显示跨度。

代码：

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example - example-ng-form-production</title>


  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-animate.js"></script>


  <script type="text/javascript">
    angular.element(document.getElementsByTagName('head')).append(angular.element('<base href="' + window.location.pathname + '" />'));
  </script>
</head>
<body ng-app="formExample">
  <script>
  angular.module('formExample', [])
    .controller('FormController', ['$scope', function($scope) {
      $scope.userType = '';
    }]);
</script>
<form name="myForm" ng-controller="FormController" class="my-form">
  userType: <input name="input" ng-model="userType">
  <span ng-show="myForm.input.length>0">show me!</span><br>
 </form>
</body>
</html>

这是演示链接：

Demo Plunker

【问题讨论】：

标签： javascript jquery angularjs

【解决方案1】：

需要检查作用域变量userType's的长度，应该是，

<span ng-show="userType.length>0">show me!</span><br>

DEMO APP

【讨论】：

谢谢@Sajeetharan
@M-S 如果对您有帮助，请标记为答案
当然，只是等待启用标记选项
如果 userType.length>0 plnkr.co/edit/vPuUWsFBtYKdxTKvXQSe?p=preview，我如何将类动态附加到另一个跨度
可以使用函数申请stackoverflow.com/questions/14643836/…

【解决方案2】：

只需检查输入模态值如下，

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example - example-ng-form-production</title>
  

  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-animate.js"></script>
  <script>
    angular.element(document.getElementsByTagName('head')).append(angular.element('<base href="' + window.location.pathname + '" />'));
    </script>
</head>
<body ng-app="formExample">
  <script>
  angular.module('formExample', [])
.controller('FormController', ['$scope', function($scope) {
  $scope.userType = '';
}]);
</script>
<form name="myForm" ng-controller="FormController" class="my-form">
  userType: <input name="input" ng-model="userType">
  <span ng-show="userType">show me!</span><br>
 </form>
</body>
</html>

【讨论】：