Giter Club home page Giter Club logo

angular-xml's Introduction

angular-xml

XML module for AngularJS.

As of version 1.0.0 this module no longer supports angular < 1.2.0. For angular <= 1.0.8 see version 0.2.0.

It provides 3 XML helpers:

  1. A parser to turn an XML string in to a DOM object.

    function MyCtrl(xmlParser) {
      var domElement = xmlParser.parse('<blogs><blog name="my first blog" id="1"/></blogs>');
      console.log(domElement);
      // => #document
    }
  2. A filter to convert an XML string in to an Angular element.

    function MyCtrl(xmlFilter) {
        var xml = xmlFilter('<blogs><blog name="my first blog" id="1"/></blogs>');
        console.log(xml.find('blog'));
        // => [blog#1]
    }
  3. A HTTP interceptor to turn all your responses in to an Angular element.

    angular
        .module('blogs', ['xml'])
        .config(function ($httpProvider) {
            $httpProvider.interceptors.push('xmlHttpInterceptor');
        });
        
    function BlogsCtrl ($scope, $http) {
        $scope.blogs = [];
        
        // We must use .then() and not .success()
        $http.get('blogs.xml').then(function (response) {
            var blogs = [],
                els = response.xml.find('blog'),
                blog,
                i;
            
            for (i = 0; i < els.length; i += 1) {
                blog = angular.element(els[i]);
                blogs.push({
                  name: blog.attr('name'),
                  id: blog.attr('id')
                });
            }
    
            $scope.blogs = blogs;
        });
    }
    <!doctype html>
    <html lang="en" ng-app="blogs">
        <head>
            <title>Blogs</title>
            <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
            <script src="angular-xml.min.js"></script>
            <script src="blogs.js"></script>
        </head>
        <body ng-controller="BlogsCtrl">
            <ul>
                <li ng-repeat="blog in blogs">
                    {{blog.id}} - {{blog.name}}
                </li>
            </ul>
        </body>
    </html>

Installation

There are 3 optoins:

  1. Download the latest tag.
  2. Use bower: bower i --save angular-xml
  3. Or use jsDelivr CDN: //cdn.jsdelivr.net/angular.xml/1.0.2/angular-xml.min.js

Tests

The tests run with karma.

Installing karma

  1. Install Node.js
  2. npm i -g karma

Run the test suite

grunt connect:dev-server
npm test

Or, to watch your files and test automatically:

npm run karma

Compiling

The source file angular-xml.js can be minifed and checked for problems using a grunt command. First make sure you have installed all npm dependencies npm i. Then run grunt.

Git Hooks

There is a git hook available for shell environments that will automatically lint, test and compile the xml module when commiting it. To use it simply link it in to the git hook directory.

cd .git/hooks && ln -s ../../pre-commit.sh pre-commit

Now when you change the angular-xml.js file and commit it, it will be linted, tested and if all is OK, then compiled and the minified version wil be added to your commit. Make sure you have a server up (grunt connect:test-server) before comitting.

angular-xml's People

Contributors

johngeorgewright avatar stanjav avatar

Watchers

Charles EDOU NZE avatar James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.