在AngularJs也有带有MVC模式。此时你完全可以把html的js中的Controller写到一个外部的js文件中。

Ok,在ASP.NET MVC项目,打开Content目录,创建一个新文件夹AngularJs目录,专门是用来存放AngularJs相关的js文件。
再在此目录下创建Controllers目录,

angular.module('myApp', []).controller('insusCtrl', function ($scope) {
$scope.Goodses = [
{ ID: 1, Item: 'A036', Description: 'DFG', Qty: 334 },
{ ID: 2, Item: 'A027', Description: 'WSD', Qty: 5 },
{ ID: 3, Item: 'A029', Description: 'VBG', Qty: 32 },
{ ID: 4, Item: 'A078', Description: 'TRF', Qty: 87 },
{ ID: 5, Item: 'A054', Description: 'CDU', Qty: 66 },
];
});

Source Code

然后在html页面引用此js就行了:

运行看看结果:

最后来看看project中的AngularJs目录结构:

AngularJs的MVC模式的更多相关文章

  1. AngularJs(一) MVC 模式的应用

    Model的应用 MVC的模式大家都是十分熟悉了,那么Angular是怎么规划的呢.数据被放在json文件中,通过Ajax获取数据. [{ "action": "Buy ...

  2. AngularJS学习笔记(1)——MVC模式的清单列表效果

    MVC模式的清单列表效果 使用WebStorm新建todo.html并链入bootstrap.css.bootstrap-theme.css.angular.js.要链入的相关css和js文件预先准备 ...

  3. AngularJS学习之MVC模式

    AngularJS是谷歌开发维护的前端MVC框架,克服了HTML在构建应用上的不足,从而降低了开发的成本. 在学习AngularJS之前,有必要和之前学过的jQuery进行对比.jQuery是java ...

  4. 【Web开发】Mean web开发 01-Express实现MVC模式开发

    简介 Mean是JavaScript的全栈开发框架.更多介绍 用Express实现MVC模式开发是Mean Web全栈开发中的一部分. Express 是一个基于 Node.js 平台的极简.灵活的 ...

  5. Android 腾讯入门教程( 智能手表UI设计 和 MVC模式 )

    *****注意到mvc 在android 中是如何进行分层分域执行各自的功能.**** 官方推荐的按钮尺寸是48像素 前端之Android入门(1):环境配置 前端之Android入门(2):程序目录 ...

  6. ASP.Net MVC开发基础学习笔记:一、走向MVC模式

    一.ASP.Net的两种开发模式 1.1 ASP.Net WebForm的开发模式 (1)处理流程 在传统的WebForm模式下,我们请求一个例如http://www.aspnetmvc.com/bl ...

  7. 完成AngularJS with MVC 5, Web API 2项目

    经过接近两个月的日夜奋战,完成AngularJS with MVC 5, Web API 2的项目,这也是进入公司以后最大的一个项目,从项目需求.用户Prototype/Demo,招人,开发完成,可谓 ...

  8. [ASP.NET MVC 小牛之路]01 - 理解MVC模式

    本人博客已转移至:http://www.exblr.com/liam  PS:MVC出来很久了,工作上一直没机会用.出于兴趣,工作之余我将展开对MVC的深入学习,通过博文来记录所学所得,并希望能得到各 ...

  9. 深入理解MVC模式

    一,什么是MVC模式 该模式是一种软件设计典范,他把软件系统划分为三个基本部分:模型层(Model).视图层(View).控制器(Controller) *Model(模型)表示应用程序核心(比如数据 ...

随机推荐

  1. maven web+spring mvc项目没有出现src/main/java路径

    直接在main 文件夹下创建java可以解决 https://www.cnblogs.com/zhujiabin/p/6343462.html

  2. 好像leeceode题目我的博客太长了,需要重新建立一个. leecode刷题第二个

    376. Wiggle Subsequence               自己没想出来,看了别人的分析. 主要是要分析出升序降序只跟临近的2个决定.虽然直觉上不是这样. 455. 分发饼干     ...

  3. ros主从关系

    主机: 在~/.bashrc里面输入 export ROS_MASTER_URI=http://localhost:11311export ROS_HOSTNAME=192.168.4.1 其ip地址 ...

  4. 【Linux】zlib安装

    zlib简介 zlib是提供数据压缩用的函式库,由Jean-loup Gailly与Mark Adler所开发,初版0.9版在1995年5月1日发表.zlib使用DEFLATE算法,最初是为libpn ...

  5. [C#.net]WinForm载入窗体完成后自动执行事件

    一.以下是网络上可搜索到的次序 当 Windows Form 应用程序启动时,会以下列顺序引发主要表单的启动事件:        System.Windows.Forms.Control.Handle ...

  6. [ASP.NET]使用Layer简介

    layer是一款近年来备受青睐的web弹层组件,她具备全方位的解决方案,致力于服务各水平段的开发人员,您的页面会轻松地拥有丰富友好的操作体验. 在与同类组件的比较中,layer总是能轻易获胜.她尽可能 ...

  7. 关于xp操作系统下使用VC6++编写的上位机软件在win10中运行的问题

    将代码拷贝到win10操作系统中,在vs2015环境中重新编译即可. 编译生成的exe出现终止时考虑mscomm控件是否注册. 当win10环境64位操作系统时,将以下四个文件放置于C:\Window ...

  8. 使用Hadoop API 压缩HDFS文件

    下篇解压缩:使用Hadoop API 解压缩 HDFS文件 起因: 集群磁盘剩余空间不足. 删除了存储在HDFS上的,一定时间之前的中间结果,发现并不能释放太多空间,查看计算业务,发现,每天的日志存在 ...

  9. 2018.12.17 hdu2138 How many prime numbers(miller-rbin)

    传送门 miller−rabbinmiller-rabbinmiller−rabbin素数测试的模板题. 实际上miller−rabinmiller-rabinmiller−rabin就是利用费马小定 ...

  10. 牛客训练三:处女座和小姐姐(三)(数位dp)

    题目链接:传送门 思路:数位dp的记忆化搜索模板 从高位向低位枚举,逐位确定每一位的6的个数,dp[i][s]表示处理到第i条边,状态为s时的数字的个数. 注意,要使用long long类型. #in ...