ASP.NET MVC中jQuery与angularjs混合应用传参并绑定数据

所属分类: 网络编程 / ASP.NET 阅读数: 1676
收藏 0 赞 0 分享

要求是这样子的,在一个列表页中,用户点击详细铵钮,带记录的主键值至另一页。
在另一外页中,获取记录数据,然后显示此记录数据在网页上。

先用动图演示:

昨天有分享为ng-click传递参数 《angularjs为ng-click事件传递参数》http://www.cnblogs.com/insus/p/7017737.html

上面仅仅是在ng-click传入一个值,但是在ASP.NET MVC中,还需要把这个值传至另外一个视图中《ASP.NET MVC传递参数(model)》http://www.cnblogs.com/insus/p/6148167.html

$scope.Detail = function (code) {
      var objects = {};
      objects.Key = code;
      objects.Value = "";
      objects.Controller = "Code";
      objects.Action = "ClauseDetail";
      $http({
        method: 'POST',
        url: '/Pass/Redirect',
        dataType: 'json',
        headers: {
          'Content-Type': 'application/json; charset=utf-8'
        },
        data: JSON.stringify(objects),
      }).then(
         function success(response) {
           if (response.data.Success) {            
             window.location.href = response.data.RedirectUrl;
           }
           else {
             alert(response.data.ExceptionMessage);
           }
         },
        function error(error) {
          alert(response.error.data);
        });
    };

在ASP.NET MVC的控制器的Action接收参数,获取数据库的数据:

public ActionResult ClauseDetail()
    {
      if (TempData["Pass"] == null)
        return RedirectToAction("Clause", "Code");
      var pass = TempData["Pass"] as Pass;
      TempData["Pass"] = pass;
      Clause c = new Models.Clause();
      c.Code = pass.Key.ToString();
      ClauseEntity ce = new ClauseEntity();
      var model = ce.ClauseByKey(c).FirstOrDefault();
      return View(model);
    } 

上面从数据库获取数据后,给视图一个model。下面是本篇所说的重点,怎样把ASP.NET MVC的model传给angularjs ng-model:

以上所述是小编给大家介绍的ASP.NET MVC中jQuery与angularjs混合应用传参并绑定数据,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

更多精彩内容其他人还在看

.NET Core源码解析配置文件及依赖注入

这篇文章我们设计了一些复杂的概念,因为要对ASP.NET Core的启动及运行原理、配置文件的加载过程进行分析,依赖注入,控制反转等概念的讲解等
收藏 0 赞 0 分享

.NET Corek中Git的常用命令及实战演练

这篇文章将通过故事的形式从Git的历史谈起,并讲述Git的强大之处。然后通过实战演练教你如何在Github以及码云上托管我们的代码并进行代码的版本控制
收藏 0 赞 0 分享

Asp.Net Core WebAPI使用Swagger时API隐藏和分组详解

这篇文章主要给大家介绍了关于Asp.Net Core WebAPI使用Swagger时API隐藏和分组的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用Asp.Net Core具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
收藏 0 赞 0 分享

如何利用FluentMigrator实现数据库迁移

这篇文章主要给大家介绍了关于如何利用FluentMigrator实现数据库迁移的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
收藏 0 赞 0 分享

ASP.NET Core利用Jaeger实现分布式追踪详解

这篇文章主要给大家介绍了关于ASP.NET Core利用Jaeger实现分布式追踪的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用ASP.NET Core具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
收藏 0 赞 0 分享

浅谈从ASP.NET Core2.2到3.0你可能会遇到这些问题

这篇文章主要介绍了ASP.NET Core2.2到3.0可能会遇到的问题,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

详解.net core webapi 前后端开发分离后的配置和部署

这篇文章主要介绍了.net core webapi 前后端开发分离后的配置和部署,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

详解ASP.Net Core 中如何借助CSRedis实现一个安全高效的分布式锁

这篇文章主要介绍了ASP.Net Core 中如何借助CSRedis实现一个安全高效的分布式锁,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

.net 4.5部署到docker容器的完整步骤

这篇文章主要给大家介绍了关于.net 4.5部署到docker容器的完整步骤,文中通过示例代码介绍的非常详细,对大家学习或者使用.net4.5具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
收藏 0 赞 0 分享

.net core并发下线程安全问题详解

这篇文章主要给大家介绍了关于.net core并发下线程安全问题的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用.net core具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
收藏 0 赞 0 分享
查看更多