javascript - 使用 Angularjs 进行文本打印时出现延迟

标签 javascript angularjs timedelay

如何延迟 Angularjs 中函数的调用? 我制作了一个简单的表格,其中有两个文本框,分别写着名字和姓氏。包含一个提交按钮,用于连接名字和姓氏并显示全名。我希望每当单击此提交按钮时,必须在 5 秒或其他时间后显示全名。我怎样才能实现这个延迟?

我的 HTML 代码如下所示:

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular-route.min.js"></script>
    <script src="myApp.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
    First Name : <input type="text" ng-model="fname"/> <br>
    Last Name : <input type="text" ng-model="lname"/><br>
    <button ng-click="clk()" > SUBMIT </button><br>
    Full Name : {{fullName}}
</body>
</html>

我的 Controller 看起来像:

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

app.controller('myCtrl', function($scope){
  $scope.fname="";
  $scope.lname="";
  $scope.fullName="";

  $scope.clk = function(){
    $scope.fullName = $scope.fname + " " + $scope.lname ;
  };

});

最佳答案

使用$timeout延迟函数内的代码执行。

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

app.controller('myCtrl', function($scope, $timeout){
  $scope.fname="";
  $scope.lname="";
  $scope.fullName="";

  $scope.clk = function(){
    $timeout(function(){
      $scope.fullName = $scope.fname + " " + $scope.lname ;
    },5000)
  };

});

关于javascript - 使用 Angularjs 进行文本打印时出现延迟,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30451972/

相关文章:

javascript - 如何在 jQuery 中显示前 n 个元素?

javascript - 选择的 AngularJS 性能

javascript - 发送 Angular POST 请求

jquery - 使用 .delay() 延迟点击事件

javascript - 如何通过codemirror启用htmlmixed模式?

javascript - Firefox下jQuery ui dialog css问题

javascript - materializecss 日期选择器 Protractor (错误 : Element is not clickable at point )

javascript - 如何减慢 JavaScript 中 for 循环的执行速度?

c - 如何用 C 创建我自己的延迟函数

javascript - 如何在 WebGL 中实现这种类似隧道的动画?