在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. servlet 高级知识之Filter

    Filter叫做拦截器, 对目标资源拦截,拦截HTTP请求和HTTP响应,本质是对url进行拦截. 与serlvet不同的是, Filter的初始化是随着服务器启动而启动. 在Filter接口中定义了 ...

  2. Firebug & Chrome Console 控制台使用指南

    转自:http://visionsky.blog.51cto.com/733317/543789 Console API 当打开 firebug (也包括 Chrome 等浏览器的自带调试工具),wi ...

  3. Flex + .Net从本地选择一个图片上传到服务器

    <mx:TextInput id="TxtFileName" editable="false" width="200"/> &l ...

  4. 自学java坎坷之路——20155312张竞予

    20155312 2006-2007-2 <Java程序设计>第一周学习总结 教材学习内容总结 第一周并没有在课堂上对教材内容进行学习,学习内容概括如下 课程分数构成,其中包括课堂测验(每 ...

  5. Java第12章笔记

    如何定义 Java 中的方法 所谓方法,就是用来解决一类问题的代码的有序组合,是一个功能模块. 一般情况下,定义一个方法的语法是: 其中: //方法名为骆驼命名法 1. 访问修饰符:方法允许被访问的权 ...

  6. POJ-3252 Avenger

    题意:在区间中,他们化成2进制的数的0的个数大于等于1的数有多少个. 思路:我们需要记录上一次0和1的个数,此外我们还要特别注意一下前导0. 如果前面全是0的时候我们就要注意下一位是不是还是0,如果一 ...

  7. markdown中自己偶尔需要的小技巧

    慢慢积累,需要时搜索,并记录与此. 1.写文章时,由于markdown不负责首行缩进,所以“空格”需要特殊的方法去实现,最简单方便的是--输入全角空格(切换全角输入,点空格) 2.markdown中注 ...

  8. thinkphp5 数据库和模型

    1.Db和模型的存在只是ThinkPHP5.0架构设计中的职责和定位不同,Db负责的只是数据(表)访问,模型负责的是业务数据和业务逻辑.2.Db和模型最明显的一个区别就是Db查询返回的数据类型为数组( ...

  9. Win7 VS2015环境编译NanoVG

    书接上回,Cairo编译好使用后,发现简单的每帧画100条随机线段就卡得不行,装了个gooreplacer( http://liujiacai.net/gooreplacer/ )上stackover ...

  10. dj forms表单组件

    手动的一个个去校验前端传过来的字段数据,是很麻烦的,利用django 的forms组件,对需要校验的字段定义好,能够大大提高效率. 校验字段功能 from django.db import model ...