Skip to content

Instantly share code, notes, and snippets.

@magnet88jp
Created May 11, 2015 14:31
Show Gist options
  • Select an option

  • Save magnet88jp/e0e4efab835c07787f1c to your computer and use it in GitHub Desktop.

Select an option

Save magnet88jp/e0e4efab835c07787f1c to your computer and use it in GitHub Desktop.
AngularJS Factory Test2: call with ui-router
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.13/angular-ui-router.js"></script>
<script>
var testApp = angular.module('app', ['ui.router']);
testApp.factory('TestFact1', function () {
return {
"elem1" : "a",
"elem2" : "b"
}
});
testApp.controller('TestCtrl1', ['$scope', 'TestFact1', function ($scope, TestFact1) {
$scope.test1 = TestFact1;
$scope.setD = function() {
TestFact1.elem1 = "d";
}
}]);
testApp.controller('TestCtrl2', ['$scope', 'TestFact1', function ($scope, TestFact1) {
$scope.test2 = TestFact1;
$scope.setC = function() {
TestFact1.elem2 = "c";
}
}]);
testApp.config(['$stateProvider', function($stateProvider) {
$stateProvider
.state('index', {
url: "/",
views: {
"main": { template: $('#view1').html() }
}
})
.state('view1', {
url: "/view1",
views: {
"main": { template: $('#view1').html() }
}
})
.state('view2', {
url: "/view2",
views: {
"main": { template: $('#view2').html() }
}
})
}]);
</script>
</head>
<body ng-app="app">
<h1>Factoryテスト</h1>
<ul>
<li ui-sref="index"><a>index</a></li>
<li ui-sref="view1"><a>view1</a></li>
<li ui-sref="view2"><a>view2</a></li>
</ul>
<div ui-view="main"></div>
<script type="text/ng-template" id="view1">
<div ng-controller="TestCtrl1">
<h2>TestView1</h2>
<p>{{test1.elem1}}</p>
<p>{{test1.elem2}}</p>
<button ng-click="setD()">setD</button>
</div>
</script>
<script type="text/ng-template" id="view2">
<div ng-controller="TestCtrl2">
<h2>TestView2</h2>
<p>{{test2.elem1}}</p>
<p>{{test2.elem2}}</p>
<button ng-click="setC()">setC</button>
</div>
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment