Trung tâm cá nhân
sách gpt4 ai đã đi

javascript - 在 AngularJS 中按时间间隔显示数据

In lại 作者：塔克拉玛干 更新时间：2023-11-02 20:59:50 25 4
mua khóa gpt4 Nike

这是 jsFiddle 的链接:AngularJS : Display Data

我的 HTML 文件如下:

         
    

           
{{test.testName}}


.js 文件下的 Controller 如下:

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

function myCtrl($scope) {
    $scope.tests = [{
        "testName" : "Test-1 : Windows Test"
        }, 
        {
        "testName" : "Test-2 : Linux Test"
        },          
        {
        "testName" : "Test-3 : Unix Test"
        }, 
    ];
}

我的问题是:

目前结果采用以下格式:

Test-1 : Windows Test
Test-2 : Linux Test
Test-3 : Unix Test

我想在开始时和 30 秒后显示 Test-1:Windows 测试 Test-2:Linux 测试 并在 30 秒后显示 Test-3 : Unix 测试 等等..!!

一旦所有数据再次完成，Test-1 : Windows Test 将再次出现..!!

我应该如何使用 AngularJS 实现它？

1 Câu trả lời

您可以使用设置的时间间隔(angular.js 中的 $interval)来完成。我不知道我该如何向你解释。但是我会用 fiddler 给出我的代码，你可以看到我做了什么。

所以试试下面的方法而不是您的代码。



   
{{testName}}



Javascript 的变化

下面的代码每个工作 30 秒(我不知道确切的 30 秒)，但是你可以把你需要的时间放在 

    angular.module('myApp',[])
   .controller("myCtrl",["$scope","$interval",function($scope, $interval){
        $scope.tests = [{
            "testName" : "Test-1 : Windows Test"
            }, 
            {
            "testName" : "Test-2 : Linux Test"
            },          
            {
            "testName" : "Test-3 : Unix Test"
            } 
        ];
         var count=0;                    
         $interval(function(){                         
                $scope.testName=$scope.tests[count].testName;
                 count=count+1;
                if($scope.tests.length==count){
                  count=0;
                }                               
         },30000); // I don't know it's exact 30 seconds     
    }]);

样本 JSFiddle Demo

我已经为您更新了正确的代码。

关于javascript - 在 AngularJS 中按时间间隔显示数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29672241/

25 4 0
Bài viết được đề xuất: java - 通知 DeleteIntent 在更高版本的 Android 上被破坏
Bài viết được đề xuất: javascript - AngularJS:获取过滤的 ng-repeat 结果计数以更新我的分页
Bài viết được đề xuất: Thư viện 'javacv-android-arm.jar' chứa các thư viện gốc sẽ không chạy trên thiết bị
Bài viết được đề xuất: javascript - loadStyleFixtures 不会在 Jasmine 测试中加载 css
塔克拉玛干
Hồ sơ cá nhân

Tôi là một lập trình viên xuất sắc, rất giỏi!

Nhận phiếu giảm giá Didi Taxi miễn phí
Mã giảm giá Didi Taxi
Các bài viết nóng hổi trên toàn bộ trang web
Giấy chứng nhận ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com