当前位置: 首页 > news >正文

.net MVC中使用angularJs刷新页面数据列表

使用angularjs的双向绑定功能,定时刷新页面上数据列表(不是刷新网页,通过ajax请求只刷新数据列表部分页面),实例如下:

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <link href="~/Content/css/bootstrap.min.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-1.8.2.min.js"></script>
    <script src="~/Content/js/bootstrap.min.js"></script>
    <script src="~/Scripts/angularjs.js"></script>
    <style>
        .bg {
            background: #0094ff;
        }

        .red {
            background: red;
        }
    </style>
</head>
<body ng-app="myM">
    <div ng-controller="myC">
       

        <div>
            <table class="table table-responsive" style="width:300px;">
                <tr ng-repeat="item in list">
                    <td>{{item.name}}</td>
                    <td>{{item.pwd}}</td>
                </tr>
            </table>
        </div>
    </div>
    <script>
        var app = angular.module("myM", []);

        app.controller("myC", function ($scope, $interval, $http) {
            $scope.list = [];
            $interval(function () {
                $.get("/home/data", {}, function (data) {
                    $scope.list = data;
                });
            }, 1000);
            
        });
    </script>
</body>
</html>
        public ActionResult data()
        {
            //    if (user.name == "admin" && user.pwd == "admin")
            //    {
            //        return Content("ok");
            //    }
            //    else

            List<Users> list = new List<Users>();
            Random rnd = new Random();
            for (int i = 0; i < rnd.Next(40,200); i++)
            {
                list.Add(new Users { name = "新人" + i, pwd = rnd.Next(100) + "" });
            }
            return Json(list,JsonRequestBehavior.AllowGet);
        }

 

转载于:https://www.cnblogs.com/lunawzh/p/6816882.html

相关文章:

  • MySQL主从同步报错排错结果及修复过程之:Slave_SQL_Running: No
  • Redis3.0 配置文件说明
  • 冲刺一阶段———个人总结06
  • pycharm的一些快捷键(含图)
  • 编译程序加不加 -lpthread 的区别【转】
  • 内联元素空隙问题
  • Tomcat7 session同步集群搭建
  • 翻译--Thinking in React
  • Uuid, BOSObjectType, BosUUid 区别
  • NSTimer学习笔记
  • input 的multiple 上传多个文件
  • 安防IP Camera固件分析
  • java汇总
  • zookeeper
  • js练习题
  • 2017届校招提前批面试回顾
  • ERLANG 网工修炼笔记 ---- UDP
  • JDK9: 集成 Jshell 和 Maven 项目.
  • Linux下的乱码问题
  • vue 配置sass、scss全局变量
  • Xmanager 远程桌面 CentOS 7
  • 可能是历史上最全的CC0版权可以免费商用的图片网站
  • 小白应该如何快速入门阿里云服务器,新手使用ECS的方法 ...
  • ​ArcGIS Pro 如何批量删除字段
  • ​草莓熊python turtle绘图代码(玫瑰花版)附源代码
  • #define用法
  • (+4)2.2UML建模图
  • (003)SlickEdit Unity的补全
  • (附源码)ssm学生管理系统 毕业设计 141543
  • (黑马出品_高级篇_01)SpringCloud+RabbitMQ+Docker+Redis+搜索+分布式
  • (力扣题库)跳跃游戏II(c++)
  • (三)终结任务
  • (收藏)Git和Repo扫盲——如何取得Android源代码
  • (一)使用Mybatis实现在student数据库中插入一个学生信息
  • (转)真正的中国天气api接口xml,json(求加精) ...
  • (转载)虚幻引擎3--【UnrealScript教程】章节一:20.location和rotation
  • .mysql secret在哪_MySQL如何使用索引
  • .NET “底层”异步编程模式——异步编程模型(Asynchronous Programming Model,APM)...
  • .net core 6 集成和使用 mongodb
  • .net framwork4.6操作MySQL报错Character set ‘utf8mb3‘ is not supported 解决方法
  • .NET Micro Framework初体验
  • .net 无限分类
  • .net 验证控件和javaScript的冲突问题
  • @param注解什么意思_9000字,通俗易懂的讲解下Java注解
  • @RequestBody与@ModelAttribute
  • [2016.7.test1] T2 偷天换日 [codevs 1163 访问艺术馆(类似)]
  • [COGS 622] [NOIP2011] 玛雅游戏 模拟
  • [C语言][PTA基础C基础题目集] strtok 函数的理解与应用
  • [Docker]五.Docker中Dockerfile详解
  • [ISCTF 2023]——Web、Misc较全详细Writeup、Re、Crypto部分Writeup
  • [LeetCode] 2.两数相加
  • [leetcode]Flatten Binary Tree to Linked List
  • [LeetCode系列]子集枚举问题[无重复元素]
  • [linux][调度] 内核抢占入门 —— 高优先级线程被唤醒时会立即抢占当前线程吗 ?
  • [nlp] 损失缩放(Loss Scaling)loss sacle