This directive allows you to split stuff !
Holy grail demo
- AngularJS
You can get it from Bower
bower install angular-ui-layout\#bower
# or
bower install angular-ui-layout\#v0.0.0
# or
bower install angular-ui-layout\#src0.0.0
This will copy the UI.Layout files into a bower_components
folder, along with its dependencies. Load the script files in your application:
<link rel="stylesheet" type="text/css" href="bower_components/angular-ui-layout/ui-layout.css"/>
<!-- ... -->
<script type="text/javascript" src="bower_components/angular-ui-layout/ui-layout.js"></script>
Add the UI.Layout module as a dependency to your application module:
var myAppModule = angular.module('MyApp', ['ui.layout']);
Finally, add the directive to your html:
<div ui-layout="{ flow : 'row' }"></div>
or
<ui-layout options="{ flow : 'row' }"></ui-layout>
Type: String
Default: 'row'
flow: row | column
A fake flex-direction property. It specifies how the child elements are placed in the layout container, by setting the direction of the flex container's main axis. This determines the direction that child elements are laid out in.
We use Karma and jshint to ensure the quality of the code. The easiest way to run these checks is to use grunt:
npm install -g grunt-cli
npm install && bower install
grunt
The karma task will try to open Firefox and Chrome as browser in which to run the tests. Make sure this is available or change the configuration in test\karma.conf.js
We have one task to serve them all !
grunt serve
It's equal to run separately:
-
grunt connect:server
: giving you a development server at http://localhost:8000/. -
grunt karma:unit
: giving you two Karma servers to run tests (at http://localhost:9876/ for tests with jQlite and http://localhost:5432/ for tests with jQuery). You can force tests on the servers withgrunt karma:unit:run
. -
grunt watch
: will automatically test your code and build your demo. You can force a demo generation withgrunt dist build:gh-pages
.