angularJs的继承
为什么要继承,本来是后端的概念,但是同样适用于前端开发。继承,无疑是将通用的东西抽取出来。
下面介绍的是angular的伪继承,就是说是通过继承scope这个变量来实现的。代码很简单,一行代码就可以。
注意:需要引入 $controller 这个服务。
代码如下:
baseController.js
- //品牌控制层
- app.controller('baseController' ,function($scope){
- //重新加载列表 数据
- $scope.reloadList=function(){
- //切换页码
- $scope.search( $scope.paginationConf.currentPage, $scope.paginationConf.itemsPerPage);
- }
- //分页控件配置
- $scope.paginationConf = {
- currentPage: 1,
- totalItems: 10,
- itemsPerPage: 10,
- perPageOptions: [10, 20, 30, 40, 50],
- onChange: function(){
- $scope.reloadList();//重新加载
- }
- };
- $scope.selectIds=[];//选中的ID集合
- //更新复选
- $scope.updateSelection = function($event, id) {
- if($event.target.checked){//如果是被选中,则增加到数组
- $scope.selectIds.push( id);
- }else{
- var idx = $scope.selectIds.indexOf(id);
- $scope.selectIds.splice(idx, 1);//删除
- }
- }
- $scope.jsonToString=function(jsonString,key){
- var json= JSON.parse(jsonString);
- var value="";
- for(var i=0;i<json.length;i++){
- if(i>0){
- value+=",";
- }
- value +=json[i][key];
- }
- return value;
- }
- });
brandController.js
- //控制层
- app.controller('brandController' ,function($scope,$controller ,brandService){
- $controller('baseController',{$scope:$scope});//继承
- //读取列表数据绑定到表单中
- $scope.findAll=function(){
- brandService.findAll().success(
- function(response){
- $scope.list=response;
- }
- );
- }
- //分页
- $scope.findPage=function(page,rows){
- brandService.findPage(page,rows).success(
- function(response){
- $scope.list=response.rows;
- $scope.paginationConf.totalItems=response.total;//更新总记录数
- }
- );
- }
- //查询实体
- $scope.findOne=function(id){
- brandService.findOne(id).success(
- function(response){
- $scope.entity= response;
- }
- );
- }
- //保存
- $scope.save=function(){
- var serviceObject;//服务层对象
- if($scope.entity.id!=null){//如果有ID
- serviceObject=brandService.update( $scope.entity ); //修改
- }else{
- serviceObject=brandService.add( $scope.entity );//增加
- }
- serviceObject.success(
- function(response){
- if(response.success){
- //重新查询
- $scope.reloadList();//重新加载
- }else{
- alert(response.message);
- }
- }
- );
- }
- //批量删除
- $scope.dele=function(){
- //获取选中的复选框
- brandService.dele( $scope.selectIds ).success(
- function(response){
- if(response.success){
- $scope.reloadList();//刷新列表
- $scope.selectIds=[];
- }
- }
- );
- }
- $scope.searchEntity={};//定义搜索对象
- //搜索
- $scope.search=function(page,rows){
- brandService.search(page,rows,$scope.searchEntity).success(
- function(response){
- $scope.list=response.rows;
- $scope.paginationConf.totalItems=response.total;//更新总记录数
- }
- );
- }
- });
angularJs的继承的更多相关文章
- angularjs controller 继承
前沿 最近在angularjs项目当中,看到 controller 好多都是重复性的代码,在 controller 当中有好多代码很相似 function(比如 controller 下的 CRUD ...
- 夺命雷公狗—angularjs—4—继承和修正继承
angularjs 中也有继承的方法,废话不多说,看代码: <!doctype html> <html lang="en"> <head> &l ...
- AngularJs之Scope作用域
前言: 上篇博文AngularJs之directive中说了Scope作用域是个大坑,所以拿出来作为重点总结! 什么是scope AngularJS 中,作用域是一个指向应用模型的对象,它是表达式的执 ...
- 《AngularJS入门与进阶》图书简介
一.图书封面 二.图书CIP信息 图书在版编目(CIP)数据 AngularJS入门与进阶 / 江荣波著. – 北京 : 清华大学出版社, 2017 ISBN 978-7-302-46074-9 Ⅰ. ...
- AngularJS 作用域与数据绑定机制
AngularJS 简介 AngularJS 是由 Google 发起的一款开源的前端 MVC 脚本框架,既适合做普通 WEB 应用也可以做 SPA(单页面应用,所有的用户操作都在一个页面中完成).与 ...
- 夺命雷公狗—angularjs—24—extend继承对象
我们的angularjs中也是给我们留下了方法来做继承的,那么他就是传授中的extend... 不过要如下所示,第二个参数是继承到第一个对象里面的... <!DOCTYPE html> & ...
- AngularJS中控制器继承
本篇关注AngularJS中的控制器继承,了解属性和方法是如何被继承的. 嵌套控制器中属性是如何被继承的? ==属性值是字符串 myApp.controller("ParentCtrl&qu ...
- angularjs 中的scope继承关系——(2)
转自:http://www.lovelucy.info/understanding-scopes-in-angularjs.html angularjs 中的scope继承关系 ng-include ...
- angularjs 中的scope继承关系——(1)
转自:http://www.lovelucy.info/understanding-scopes-in-angularjs.html JavaScript 的原型链继承 假设父类 parentScop ...
随机推荐
- [BZOJ2138]stone[霍尔定理+线段树]
题意 一共有 \(n\) 堆石子,每堆石子有一个数量 \(a\) ,你要进行 \(m\) 次操作,每次操作你可以在满足前 \(i-1\) 次操作的回答的基础上选择在 \([L_i,R_i]\) 区间中 ...
- LeetCode Container With Most Water (Two Pointers)
题意 Given n non-negative integers a1, a2, ..., an, where each represents a point at coordinate (i, ai ...
- FME Cloud 账号申请流程
第一步,访问SAFE的FME Cloud注册页,官网明确表态,如果你是一个新的FME Cloud用户,你可以免费获得一个初级版.地址:https://console.fmecloud.safe.com ...
- 阿里(蚂蚁,菜鸟)+百度+网易面经(JAVA)
本人综述: 本人本科和硕士均是毕业于普通的双非院校,参加过ACM竞赛,阿里面了三次全被拒了,网易收到offer. 阿里面试: 阿里的面试问的都是很基础的东西,如操作系统的简单问题,计算机网络的基本问题 ...
- BigDecimal的setScale()方法无效(坑)
最近在使用BigDecimal进行四舍五入时,发现setScale()方法设置的精度值并没有起作用,一度让我怀疑起是否jdk有bug,代码如下: 错误代码 double d = 7.199999999 ...
- PAT甲题题解-1081. Rational Sum (20)-模拟分数计算
模拟计算一些分数的和,结果以带分数的形式输出注意一些细节即可 #include <iostream> #include <cstdio> #include <algori ...
- linux第一次实验报告
http://wwwcnblogs.com/20135228guoyao/4964477.html
- 四则运算level2
package j; import java.util.Scanner; public class Main { public static void main(String[] args) { Sc ...
- YOLO(You Only Look Once)
参考 YOLO(You Only Look Once)算法详解 YOLO算法的原理与实现 一.介绍 YOLO算法把物体检测问题处理成回归问题,用一个卷积神经网络结构就可以从输入图像直接预测boundi ...
- (改进)Python语言实现词频统计
需求: 1.设计一个词频统计的程序. 2.英语文章中包含的英语标点符号不计入统计. 3.将统计结果按照单词的出现频率由大到小进行排序. 设计: 1.基本功能和用法会在程序中进行提示. 2.原理是利用分 ...