<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. 【Heritrix基础教程之2】Heritrix基本内容介绍 分类: B1_JAVA H3_NUTCH 2014-06-01 13:02 878人阅读 评论(0) 收藏

    1.版本说明 (1)最新版本:3.3.0 (2)最新release版本:3.2.0 (3)重要历史版本:1.14.4 3.1.0及之前的版本:http://sourceforge.net/projec ...

  2. ORA-00907: 缺失右括号问题整理解决

    ORA-00907: 缺失右括号 前言 近期在开发过程中使用oracle数据库,在程序中进行查询数据时遇到了"ORA-00907: 缺失右括号"的问题.可是假设直接把sql语句直接 ...

  3. php汉字字符串长度和截取

    mb_strlen("你好123",'utf-8');//返回5 strlen("你好");//返回几我也不知道,肯定不是2,但你想要2就用上面的 substr ...

  4. Tokumx vs Mongodb

    Mongodb是一个文档型nosql数据库 採用C++编写 Mongo DB最大的优势在于全部的数据持久操作都无需开发者手动编写SQL语句,直接调用方法就能够轻松的实现CRUD操作. 非常多人觉得mo ...

  5. 一小时内破解16位强password

    password能够用来保护你的金融交易.你的社交网络站点,和其它貌似安全的在线站点的主机.人们常常说:"不要把字典里的单词用来做password.它们超级不安全". 但是,要是黑 ...

  6. luogu 3939 数颜色 - STL(vector)

    传送门 分析: 虽然颜色种类很多,但是所有颜色个数之和n是一定的,这时候就可以使用vector对每个颜色维护一个坐标集合,空间只占n个. 对于查询L,R:直接一行: upper_bound(col[c ...

  7. BZOJ1297 迷路 - 矩阵的幂

    传送门 题目大意: 输入n(点的数量),t(时间),和一个n*n的矩阵,第i行第j列表示第i个节点到第j个节点有一条matrix[i][j](0~9)时间的边,若为0则没有边,问从1到n恰好经过t时间 ...

  8. LUOGU 1137 - 拓扑排序

    传送门 题目分析 拓扑排序:将图从度为0的点不断的剥掉外层的点,即可得到拓扑序,再按照拓扑序进行一遍简单的dp. code #include<bits/stdc++.h> using na ...

  9. 模块化模式与 OSGi

    模块化模式与 OSGi Android 模块化探索与实践 一.前言 万维网发明人 Tim Berners-Lee 谈到设计原理时说过:“简单性和模块化是软件工程的基石:分布式和容错性是互联网的生命.” ...

  10. Docker for Windows 安装

    原文:Docker for Windows 安装 前言: 环境:windows10专业版 64位 正文: 官方下载地址:https://hub.docker.com/editions/communit ...