一个简易版的Angular js 三层 示例
var myApp = angular.module('produceline', []);
myApp.factory('ajax', ["$http", "$q", "$log", function ($http, $q, $log) {
return {
//post请求,第一个参数是URL,第二个参数是向服务器发送的参数(JSON对象),
post: function (url, data, funsuccess) {
var deferred = $q.defer();
var tempPromise;
if (data != null && data != undefined && data != "") {
tempPromise = $http.post(url, data);
} else {
tempPromise = $http.post(url);
}
tempPromise.success(function (data, header, config, status) {
deferred.resolve(data);
}).error(function (msg, code) {
$log.error(msg, "post url:" + url + " 出错,代码:" + code);
deferred.reject(msg);
});
return deferred.promise.then(funsuccess);
},
//get请求,第一个参数是URL,第二个参数是向服务器发送的参数(JSON对象), 此方法有问题
get: function (url, data, funsuccess) {
var deferred = $q.defer();
var tempPromise;
//判断用户是否传递了参数,如果有参数需要传递参数
if (data != null && data != undefined && data != "") {
tempPromise = $http.get(url, data); //params {params: {id:5}}
} else {
tempPromise = $http.get(url);
}
tempPromise.success(function (data, header, config, status) {
deferred.resolve(data);
}).error(function (msg, code) {
deferred.reject(msg);
$log.error(msg, "get Url:" + url + " 出错,代码:" + code);
});
return deferred.promise.then(funsuccess);
}
};
}]);
myApp.controller('producelineController', ['$scope', "ajax", function ($scope, ajax) {
//扫描枪中止符 13 为回车
$scope.endWidthScan = 13;
$scope.model = {};
$scope.partSegments = []; //生产线分段
$scope.init = function () {
$("#scantxt").focus();
$.extend($scope.model, modeljson);
$scope.partSegments = partSegments || [];
//for (var i = 0; i < $scope.partSegments.length; i++) {
// $scope.partcodesmodel[$scope.partcodes[i]] = '';
//}
};
$scope.init();
$scope.SaveSacnedProduct = function (product) {
//一次保存一个扫描项
var data = {};
data[product] = $scope.ScanedHash[product];
ajax.post($scope.model.UrlLineSave, { 'id': $scope.model.ID, 'json': angular.toJson(data) }, function (response) {
console.log('get ' + $scope.model.UrlLineSave + ' return t:' + response.t);
})
};
$scope.newSegment = function () {
var seg = { SegmentName: '', SegmentCode: '', Remark: '' };
$scope.partSegments.push(seg);
};
$scope.delSegment = function (idx,array) {
array.splice(idx, 1)
};
$scope.ProductScanComplete = function () {
$scope.CopyToHash($scope.ScaningProduct);
$scope.ScaningProduct = "";
$scope.complete.push($scope.ScaningProduct)
$scope.PlaySuccess();
}
$scope.IsProductComplete = function (product) {
if (product == '' || product == null) {
return false;
}
for (var i = 0 ; i < $scope.partcodes.length ; i++) {
var t = $scope.partcodesmodel[$scope.partcodes[i]];
if (t && t != null && t != '') {
continue;
}
return false;
}
return true;
};
$scope.AllEmpty = function (product) {
for (var i = 0 ; i < $scope.partcodes.length ; i++) {
var t = $scope.partcodesmodel[$scope.partcodes[i]];
if (t == '') {
continue;
}
return false;
}
return true;
};
$scope.showJson = function () {
alert(angular.toJson(
{
//'complete': $scope.complete,
//'partcodes': $scope.complete,
//'partcodesmodel': $scope.partcodesmodel,
ScanedHash: $scope.ScanedHash,
ID: $scope.ID
//ScaningProduct: $scope.ScaningProduct,
//ScanedPartHash: $scope.ScanedPartHash,
//samecodecount: $scope.samecodecount
})
);
};
}]);
一个简易版的Angular js 三层 示例的更多相关文章
- 来,我们手写一个简易版的mock.js吧(模拟fetch && Ajax请求)
预期的mock的使用方式 首先我们从使用的角度出发,思考编码过程 M1. 通过配置文件配置url和response M2. 自动检测环境为开发环境时启动Mock.js M3. mock代码能直接覆盖g ...
- 使用 js 和 Beacon API 实现一个简易版的前端埋点监控 npm 包
使用 js 和 Beacon API 实现一个简易版的前端埋点监控 npm 包 前端监控,埋点,数据收集,性能监控 Beacon API https://caniuse.com/beacon 优点,请 ...
- 使用 js 实现一个简易版的模版引擎
使用 js 实现一个简易版的模版引擎 regex (function test() { this.str = str; })( window.Test = ...; format() { let ar ...
- 使用 js 实现一个简易版的 drag & drop 库
使用 js 实现一个简易版的 drag & drop 库 具有挑战性的前端面试题 H5 DnD js refs https://www.infoq.cn/article/0NUjpxGrqRX ...
- 使用 js 实现一个简易版的动画库
使用 js 实现一个简易版的动画库 具有挑战性的前端面试题 animation css refs https://www.infoq.cn/article/0NUjpxGrqRX6Ss01BLLE x ...
- 使用 js 实现一个简易版的 GIPHY 动图搜索 web 应用程序
使用 js 实现一个简易版的 GIPHY 动图搜索 web 应用程序 具有挑战性的前端面试题 API JAMstack refs https://www.infoq.cn/article/0NUjpx ...
- 使用 js 实现一个简易版的 async 库
使用 js 实现一个简易版的 async 库 具有挑战性的前端面试题 series & parallel 串行,并行 refs https://www.infoq.cn/article/0NU ...
- 使用 js 实现一个简易版的 vue 框架
使用 js 实现一个简易版的 vue 框架 具有挑战性的前端面试题 refs https://www.infoq.cn/article/0NUjpxGrqRX6Ss01BLLE xgqfrms 201 ...
- 手动实现一个简易版SpringMvc
版权声明:本篇博客大部分代码引用于公众号:java团长,我只是在作者基础上稍微修改一些内容,内容仅供学习与参考 前言:目前mvc框架经过大浪淘沙,由最初的struts1到struts2,到目前的主流框 ...
随机推荐
- ES6学习4 变量的解构赋值
变量的解构赋值 一.数组结构赋值 1.数组结构赋值 let [a, b, c] = [1, 2, 3]; ES6 可以从数组中提取值,按照对应位置,对变量赋值. 1) 本质上,这种写法属于“模式匹配 ...
- TCP服务器如何区分不同的用户
CS架构:使用SOCKET(一般是一个整数),当服务器侦听到连接请求的时候,accept会返回一个SOCKET(用于识别不同的连接,可以理解成,SOCKET是区分不同连接的ID).当服务器listen ...
- caioj 1078 动态规划入门(非常规DP2:不重叠线段)(状态定义问题)
我一开始想的是前i个区间的最大值 显然对于当前的区间,有不选和选两种情况 如果不选的话,就继承f[i-1] 如果选的话,找离当前区间最近的区间取最优 f[i] = max(f[i-1, f[j] + ...
- DATA_PUMP_DIR impdp 指定导出目录
1.mkdir /tdms1/oracle/dump 2.sqlplus / as sysdba 3.create directory udir as '/tdms1/oracle/dump'; 4. ...
- 洛谷 P2083 找人
P2083 找人 题目背景 无 题目描述 小明要到他的同学家玩,可他只知道他住在某一单元,却不知住在哪个房间.那个单元有N层(1,2……N),每层有M(1,2……M)个房间. 小明会从第一层的某个房间 ...
- ArcGIS api for javascript——加入地图并显示当前地图范围
描述 这个示例使用Map.extent property属性接收地图范围的左下角和右上角坐标 "书签". 使用下列行创建地图: var map = new esri.Map(&qu ...
- 为什么Java里的Arrays.asList不能用add和remove方法?
在平时的开发过程中,我们知道能够将一个Array的对象转化为List.这种操作,我们仅仅要採用Arrays.asList这种方法即可了.笔者前段时间一直用这种方法,有一天,我发现通过Arrays.as ...
- Linux能ping通IP,ping不通域名
今天碰到个问题, 能ping通IP地址, ping不通域名, 一直以为是 DNS解析服务器的问题, 找了半天. 问题不在这里. [root@www postfix]# cat /etc/resolv. ...
- JAVA并发-内置锁和ThreadLocal
上一篇博客讲过,当多个线程访问共享的可变变量的时候,可以使用锁来进行线程同步.那么如果线程安全性存在的3个前提条件不同时存在的话,自然就不需要考虑线程安全性了.或者说如果我们能够将某个共享变量变为局部 ...
- dubbo+zookeeper+springMVC +maven
pom: <dependency> <groupId>com.github.sgroschupf</grou ...