<div ng-app="multipliedCaculateApp" ng-controller="multipliedCaculateController as vm">
<div class="form-group col-md-4">
<label><span class="red">*</span>单价(元):</label>
<input type="text" class="form-control width-60" ng-change="vm.getTotalPrice()"
ng-model="vm.editResource.unitPrice"/>
</div>
<div class="form-group col-md-4">
<label><span class="red">*</span>数量:</label>
<input type="text" class="form-control width-60" ng-change="vm.getTotalPrice()"
ng-model="vm.editResource.listingNumber"/>
</div>
<div class="form-group col-md-4">
<label><span class="red">*</span>总价(元):</label>
<input type="text" disabled ng-model="vm.editResource.totalPrice"
required class="form-control width-60" />
</div>
</div>
<script src="~/Scripts/angular.min.js"></script>
<script>
var mainApp = angular.module("multipliedCaculateApp", []);
mainApp.controller('multipliedCaculateController', function ($scope) {
debugger;
var vm = this;
//editResource是个object 可以不给unitPrice和listingNumber赋默认值
vm.editResource = {
unitPrice:1,
listingNumber:2
};
vm.getTotalPrice = function () {
vm.editResource.totalPrice =vm.editResource.unitPrice * vm.editResource.listingNumber;
}
vm.getTotalPrice();
});
</script>

AngularJS 页面计算的更多相关文章

  1. angularJs 页面定时刷新

    angularJs 页面定时刷新 页面定时刷新并在页面离开时停止自动刷新 var autoRefresh; //自动刷新 autoRefresh = $interval($scope.loadData ...

  2. IE下angularJS页面跳转的bug

    用Angularjs做项目的过程中遇到一种情况:就是在IE浏览器下,当访问网站页面后,点击浏览器中的向左和向右(返回和前进)按钮时,需要点击两次才能正确跳转,但是在chrome及其他浏览器下该bug没 ...

  3. angularjs 页面缓存及动态刷新解决方案

    一.准备工作 框架:angularjs ui组件库:ionic1 二.页面缓存cache 路由设置cache参数,true为缓存,false为不缓存,代码如下: angular.module('app ...

  4. angularjs页面传参

    例如:路由配置如下: $stateProvider.state('admin.userList', { url: '/listUser?type&role',         //参数必须先在 ...

  5. angularJs 页面筛选标签小功能

    页面html: <div class="bar bar-calm bar-header"> <div class="title">新闻分 ...

  6. AngularJs页面跳转

    同一页面之间的跳转: $state.go('station.booking'); 打开新页面的跳转方式: var url = $state.href("knowledge.questiond ...

  7. AngularJS 页面基本操作

    一.避免预先加载angular模板语法 <style> [ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, ...

  8. angularJs 页面{{xxx}}使用三目运算符

    <td>{{::item.sex=='w'?'女':'男'}}</td>,记得引号.也可以不用::,用不用::的区别,自行百度

  9. AngularJS页面【uib-dropdown】控件在模态窗口(弹出窗)中无法使用问题

    如果你的下拉框中有属性 dropdown-append-to-body 将它去掉,即可正常使用该插件. <div class="btn-group dropdown" uib ...

随机推荐

  1. 多线程之线程通信条件Condition二

    接上一篇,实现Condition三个条件,有这样一个应用: 1. 有三个进程,第一个进程运行1次,第二个进程运行2次,第三个进程运行3次: 2. 先运行第二个进程,然后第一个,然后第三个: 3.  依 ...

  2. 上传文件是常要处理的事情,使用ajaxFileUpload.js处理比较方便,这里的ajaxFileUpload.js文件修改过的,

    上传文件是常要处理的事情,使用ajaxFileUpload.js处理比较方便,这里的ajaxFileUpload.js文件修改过的, Html部分 <input type="file& ...

  3. Xcode6 模拟器路径

    Xcode6公布后,出现了非常多的变动,功能性的变动,在这里不进行过多的赘述,在WWDC上苹果已经进行了讲述,网上也有非常多文章,这里要介绍的是一些不太easy发现的,但非常重要的小地方.      ...

  4. PatentTips – CoAP Segment size determination

    BACKGROUND OF THE INVENTION The subject matter disclosed herein relates to routing data through a ne ...

  5. ssh和SSH服务(包含隧道内容)

    ssh和SSH服务(包含隧道内容) 72.16.10.6:/etc/fstab-->/172.16.10.3:/tmp/a.txt. [root@xuexi ~]# scp 172.16.10. ...

  6. Python将被加入高考科目?你怎么看?

    今天看到这样的一则新闻:不禁感叹,人工智能这股风来的太快,已经掀起全民学习Python的浪潮. 2017年中观察:看上去这个大纲内容基本是这样了,但是实行年份可能要往后推了,不在2017年执行了(据说 ...

  7. 数据挖掘之分类算法---knn算法(有matlab样例)

    knn算法(k-Nearest Neighbor algorithm).是一种经典的分类算法. 注意,不是聚类算法.所以这样的分类算法必定包含了训练过程. 然而和一般性的分类算法不同,knn算法是一种 ...

  8. Xcode7 不能使用http网络请求问题解决

    最近使用Xcode 7.0 写代码,发送网路请求提示:  App Transport Security has blocked a cleartext HTTP (http://) resource ...

  9. 回顾Oracle几个用到的基本语句

    create table t_name(id number,name varchar2(10)); drop table t_name; select * from table_name where ...

  10. iOS 取消多余tableView的横线的写法

    - (void)setExtraCellLineHidden: (UITableView *)tableView{ UIView *view =[ [UIView alloc]init]; view. ...