<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>UI-ROUTER basic navigation example</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<html ng-app="myApp">
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<!-- get bootstrap CSS -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<!-- get AngularJS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.3/angular.min.js"></script>
<!-- get Angular ui-router JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.18/angular-ui-router.min.js"></script>
</head>
<body ng-controller="Ctrl" class="padding">
<button type="button" class="btn btn-primary" ng-click="navigate()">Navigate using $state</button>
<button type="button" class="btn btn-primary" ui-sref="home">Navigate using ui-sref</button>
<ui-view></ui-view>
</body>
</html>
<script src="js/index.js"></script>
</body>
</html>
/*Downloaded from https://www.codeseek.co/-kaik-/ui-router-basic-navigation-example-wMRYGE */
.padding {
padding: 30px;
}
.btn {
margin-bottom: 10px !important;
}
/*Downloaded from https://www.codeseek.co/-kaik-/ui-router-basic-navigation-example-wMRYGE */
angular.module('myApp', ['ui.router'])
.controller('Ctrl', function($scope, $state){
$scope.navigate = function(){
$state.go('home');
}
})
.config(function($stateProvider){
$stateProvider
.state('home', {
url: '/home.html',
template: '<p>Hi world!</p>'
});
});
Bootstrap
Angular
ReactJS
jQuery
VueJS
HTML
CSS
JavaScript
AngularJS
v1.4.3
Twitter Bootstrap
