[英]Spring boot angularJS application JAVA JS
我发布了一些在学习angularjs时编写的代码。 我已经制作了一个资源文件,可以从后端和我正在调用此函数的控制器中获取剩余调用,但是我不知道如何在index.html文件中调用该控制器。
调节器
(function () {
'use strict';
angular.module('carApp').controller('HomeController',
HomeController);
HomeController.$inject = ['$rootScope', '$scope', 'HomeResourceService'];
function HomeController($rootScope, $scope, HomeResourceService) {
var vm = this;
function loadTestData(key, value) {
vm.test = undefined;
return HomeResourceService.getTestData(key,
value).then(function (response) {
vm.test = response.data;
}).catch(function () {
console.log('Error when try to get test data!');
});
}
}
})();
的index.html
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="UTF-8">
<title>SCARS HOME</title>
</head>
<body ng-app="carApp">
<script
src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js">
</script>
<script src="app/app.js"></script>
<script src="app/home/home-resource.js"></script>
<script src="app/home/home-controller.js"></script>
</body>
</html>
资源
(function() {
'use strict';
angular.module('carApp').factory('HomeResourceService',
HomeResourceService);
HomeResourceService.$inject = [ '$http' ];
function HomeResourceService($http) {
var service = {};
var getTestDataUrl = '/api/data';
service.getTestData = function(key, value) {
return $http({
method : "GET",
url : getTestDataUrl,
params : {
operator : key,
market : value
}
});
};
return service;
}
})();
您都可以利用控制器提供控制器name.In你的情况NG控制器是HomeController的 。
例如:如果您有一些登录页面,并且想要在登录页面中调用loginController,则可以像下面的代码片段中那样调用它。
<div ng-controller="LoginController as login" class="col-xs-12 loginForm">
<div class="center-deck">
</div>
</div>
您的控制器将是这样的:
(function() {
"use strict";
angular.module("login").controller("LoginController", LoginController);
LoginController.$inject = ["$location",'$rootScope', '$window', '$scope'];
function LoginController($location, $rootScope, $window, $scope) {
var _this = this;
$rootScope.showHeader = false;
$scope.loginError = false;
_this.authenticate = authenticate;
function authenticate() {
if($scope.login.username === "mail id" && $scope.login.password === "your password") {
$location.path('/dashboard');
$scope.loginError = false;
} else {
$scope.loginError = true;
$location.path("/login");
}
}
}
})();
它显示了如何在项目中实现登录呼叫功能。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.