AngularJS语法三

来源：互联网发布：机票怎么订最便宜知乎编辑：程序博客网时间：2024/06/09 16:43

使用module组织依赖关系
provider(name,Object OR constructor())
说明：一个可配置的服务，创建逻辑比较的复杂。如果你传递了一个Object作为参数，那么这个Object对象必须带有一个名为$get的函数，这个函数需要返回服务的名称。否则，angularjs会认为你传递的时一个构造函数，调用构造函数会返回服务实例对象。
factory(name,$get Function())
说明：一个不可配置的服务，创建逻辑比较的复杂。你需要指定一个函数，当调用这个函数时，会返回服务实例。可以看成provider(name,{$get:$getFunction()})的形式。
service(name,constructor()) 一个不可配置的服务，创建逻辑比较的简单。与上面的provider函数的constructor参数类似，Angular调用他可以创建服务实例。

使用module factory的例子

<html ng-app='ShoppingModule'><head><title>Your Shopping Cart</title><script type="text/javascript" src="angular.min.js"></script><script type="text/javascript">    var ShoppingModule = angular.module('ShoppingModule',[]);    ShoppingModule.factory('Items',function() {        var  items = {};        items.query = function() {            return [                {title:'Paint pots',description:'Pots full of Paint',price:3.95},                {title:'Paint pots',description:'Pots full of Paint',price:3.95},                {title:'Paint pots',description:'Pots full of Paint',price:3.95}            ];        };        return items;    });    function ShoppingController($scope,Items) {        $scope.items = Items.query();    }</script></head><body ng-controller='ShoppingController'><h1>Shop!!</h1><table>    <tr ng-repeat='item in items'>        <td>{{item.title}}</td>        <td>{{item.description}}</td>        <td>{{item.price | currency}}</td>    </tr></table></body></html>

引入第三方模块
在大多数应用中，创建供所有代码使用的单个模块，并把所有依赖的东西放入这个模块中，这样就会工作的很好。但是，如果你打算使用第三方包提供的服务或者指令，他们一般都带有自己的模块，你需要在应用模块中定义依赖关心才能引用他们。
例如：
var appMod = angular.module('app',['Snazzy','Super']);

关于filter的例子

<html ng-app='ShoppingModule'><head><title>Your Shopping Cart</title><script type="text/javascript" src="angular.min.js"></script><script type="text/javascript">    var ShoppingModule = angular.module('ShoppingModule',[]);    ShoppingModule.filter('titleCase',function() {        var titleCaseFilter = function(input) {            var words = input.split(' ');            for(var i=0;i<words.length;i++) {                words[i] = words[0].charAt(0).toUpperCase() + words[i].slice(1);            }            return words.join(' ');        };        return titleCaseFilter;    });    function ShoppingController($scope) {        $scope.pageHeading = 'this is a test case';    }</script></head><body ng-controller='ShoppingController'><h1>{{pageHeading | titleCase}}</h1></body></html>

0 0