app.config(['$routeProvider', function($routeProvider) { $routeProvider. when('/', { title: 'Customers', templateUrl: 'partials/customer/customers.html', controller: 'listCustomerCtrl' }) .when('/properties', { title: 'Properties', templateUrl: 'partials/property/properties.html', controller: 'listPropertyCtrl' }) .when('/edit-customer/:customerID', { title: 'Edit Customers', templateUrl: 'partials/customer/edit-customer.html', controller: 'editCustomerCtrl', resolve: { customer: function(user_services, $route){ var customerID = $route.current.params.customerID; return user_services.getCustomer(customerID); } } }) .when('/edit-property/:p_id', { title: 'Edit Property', templateUrl: 'partials/property/edit-property.html', controller: 'editPropertyCtrl', resolve: { property: function(property_services, $route){ var p_id = $route.current.params.p_id; return property_services.getProperty(p_id); } } }) .otherwise({ redirectTo: '/' }); }]);
Category: ANGULARJS
How to call API in angular js
app.factory("user_services", ['$http', function($http) { var serviceBase = 'api/'; var obj = {}; obj.getCustomers = function(){ return $http.get(serviceBase + 'customers'); }; obj.getCustomer = function(customerID){ return $http.get(serviceBase + 'customer?id=' + customerID); }; obj.insertCustomer = function (customer) { return $http.post(serviceBase + 'insertCustomer', customer).then(function (results) { return results; }); };obj.updateCustomer = function (id,customer) { return $http.post(serviceBase + 'updateCustomer', {id:id, customer:customer}).then(function (status) { return status.data; }); };
obj.deleteCustomer = function (id) {
return $http.delete(serviceBase + 'deleteCustomer?id=' + id).then(function (status) {
return status.data;
});
};
return obj;
}]);
Instead of using factories we also can use angular services to call the APIs.
Looping in Angular JS
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <script> angular.module('myApp', []).controller('namesCtrl', function($scope) { $scope.names = [ {name:'Sachin',country:'Norway'}, {name:'Saurabh',country:'Sweden'}, {name:'Gaurav',country:'Denmark'} ]; }); </script><div ng-app="myApp" ng-controller="namesCtrl">
<ul>
<li ng-repeat="x in names">
{{ x.name + ', ' + x.country }}
</li>
</ul>
</div>
Data binding in angularjs
<!DOCTYPE html> <html> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <body>
<div ng-app="">
<p>Input something in the input box:</p>
<p>Name: <input type="text" ng-model="name"></p>
<p ng-bind="name"></p>
</div>
</body>
</html>