Angularjs演示Service功能

在angularjs中,我们可以自定义自己的service。可以说得是自定义的方法,函数。

下面我们一步一步来演示吧:
首先为angularjs定义一个app:

var demoApp = angular.module(‘demoApp‘, []);

Source Code

demoApp名称即是我们定义好的app。下面是本篇的重点,定义一个service:

demoApp.service(‘calcService‘, function () {
    this.Addition = function (num1, num2) {
        return num1 + num2;
    }

    this.Substruction = function (num1, num2)
    {
        return num1 - num2;
    }

    this.Multiplication = function(num1, num2)
    {
        return num1 * num2;
    }

    this.Division = function (num1,num2)
    {
        return num1 / num2;
    }
});

Source Code

angularjs还差一个控制器:

demoApp.controller(‘demoController‘, function ($scope, calcService) {
    $scope.result1 = calcService.Addition(12, 4);
    $scope.result2 = calcService.Substruction(14, 3);
    $scope.result3 = calcService.Multiplication(7, 9);
    $scope.result4 = calcService.Division(15, 3);
});

Source Code

最后ASP.NET MVC 视图的实现:

程序运行得到的结果:

时间: 2024-10-14 23:05:30

Angularjs演示Service功能的相关文章

angularjs 实现排序功能

实现公式:{{orderBy_expression | orderBy:expression:reverse}} Example <script> var app=angular.module("myApp",[]);    app.controller("Ctrl",function($scope){        $scope.friends=[            {name:"John",phone:'555-1212',a

AngularJS中service,factory,provider的区别

1.factory() Angular里面创建service最简单的方式是使用factory()方法. factory()让我们通过返回一个包含service方法和数据的对象来定义一个service.在service方法里面我们可以注入services,比如 $http 和 $q等. 在service里面当我们仅仅需要的是一个方法和数据的集合且不需要处理复杂的逻辑的时候,factory()是一个非常不错的选择. 注意:需要使用.config()来配置service的时候不能使用factory()

AngularJS中service,factory,provider的区别(转载:http://my.oschina.net/tanweijie/blog/295067)

目录[-] 一.service引导 二.service 1.factory() ‍2.service()‍ ‍3.provider()‍‍ 一.service引导 刚开始学习Angular的时候,经常被误解和被初学者问到的组件是 service(), factory(), 和 provide()这几个方法之间的差别.This is where we'll start the twenty-five days of Angular calendar. 二.service 在Angular里面,se

AngularJS(二)——使用AngularJS自定义service

与 Java 相似, AngularJS 中的 controller 应该尽可能保持短小精悍,不提倡在 controller 中进行 DOM 操作和数据操作.先来看一个臃肿.难以维护的 controller : var app = angular.module('APPModule', []); app.controller('MainController', function($scope) {   $scope.shouldShowLogin = true;   $scope.showLog

angularjs factory,service,provider 自定义服务的不同

angularjs框架学了有一段时间了,感觉很好用.可以把angularjs的app理解成php的class,controller是控制器,而内置服务和自定义服务就可以理解成models了.angularjs的内置服务多,例如:$scope,$rootScope,$http,$q,$resource,$routeProvider等等,下面来说一下怎么自定义服务 一,factory,service,provider自定义服务,services.js 'use strict'; /* Service

Make AngularJS $http service behave like jQuery.ajax()(转)

There is much confusion among newcomers to AngularJS as to why the $http service shorthand functions ($http.post(), etc.) don’t appear to be swappable with the jQuery equivalents (jQuery.post(), etc.) even though the respective manuals imply identica

angularjs制作购物车功能

尊重劳动成果,转载请注明出处(http://blog.csdn.net/sllailcp/article/details/47833315)... 初学angularJS   闲暇之余做了个小案例. 功能:计算购物车商品的价格,以及删除购物车商品. 以下是完整案例(jQuery和angularjs需要自己引入) <!doctype html> <html ng-app="myApp"> <head> <meta charset="ut

Angularjs创建service的5种方法

1.类型一 类型                适合使用场景(reson理由) module.value  存储简单的值在运行期间可以进行更改. 2.类型二 module.constant  存储简单的值在运行期间不去更改. 3.类型三 module.service     用构造方法(constructor  method)来创建服务(service),对于喜欢面向对象编程的开发者来说更适合,就像使用rhis关键字一样. 4类型四 module.factory     用构造函数(constr

angularjs的service

1.首先我们创建一个模块 var module = angular.module( "my.new.module", [] ); 2.然后写具体的service 可以看到它是一个很有趣的对象 ,以键值对的方式定义属性和值, 值可能是数组,json对象数组,或者函数 appServices.service('Book',['$rootScope',function($rootScope){ var service = { books: [ {title:'bbq',anthor:'李斯'