【问题标题】:Path Variable using AngularJS and Spring使用 AngularJS 和 Spring 的路径变量
【发布时间】:2017-06-15 23:11:11
【问题描述】:

我正在尝试使用 PathVariable 制作带有 Hello 和名称用户的简单页面。好吧,如果你来http://localhost:8080/#/John,你会在网站上看到“Hello John”。

我知道很好的 ​​Java,但在 AngularJS 中我是初学者。好吧,我认为它的问题。

你好控制器

@Controller
@RequestMapping("/{name}")
public class HelloController {


@RequestMapping(value = "/{name}", method = RequestMethod.GET)
public @ResponseBody
String name(@PathVariable String name) {
    return this.name(name);
}


@RequestMapping("/layout")
public String getHomePage(ModelMap modelMap) {
    return "hello/layout";
}
}

角度的HelloController

var HelloController = function($scope, $http) {

var name = $name;
$scope.name = function(name) {

    $http.get(name).success(function() {
    })

};}

app.js

var AngularSpringApp = {};

var App = angular.module('AngularSpringApp', ['AngularSpringApp.filters',         'AngularSpringApp.services', 'AngularSpringApp.directives']);

// Declare app level module which depends on filters, and services
App.config(['$routeProvider', function ($routeProvider) {


$routeProvider.when('/home', {
    templateUrl: 'home/layout',
    controller: HomeController
});

$routeProvider.when('/:name', {
    templateUrl: 'hello/layout',
    controller: HelloController
 });
 }]);

简单页面hello/layout.html

 <div class="alert alert-error" ng-show="error">{{errorMessage}}</div>
 <form class="form-horizontal">

  <h1>Hello {{name}}</h1>
 </form>

感谢您的帮助!

【问题讨论】:

    标签: java angularjs spring


    【解决方案1】:

    您可以在加载 angularJS 时简单地从 URL 中提取名称并将其与名称范围变量绑定。

    angular.module('sortApp', [])
    
                .controller('mainController', function($scope,$window) {
         $scope.name=$window.location.href.split("#/")[1];
         console.log($scope.name);
    });
    

    然后在 HTML 中使用 {{name}} 绑定它

    【讨论】:

    • 当您运行此代码时,打开控制台(谷歌浏览器的)并告诉输出是什么?我的意思是我想知道 console.log() 行的结果。
    • 我对代码进行了更改,我忘记在控制器函数中添加 $window,我的错误是我对代码进行了更改。立即尝试。
    猜你喜欢
    • 2015-03-15
    • 2013-11-20
    • 2020-05-10
    • 2022-10-13
    • 2018-01-31
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-05-03
    相关资源
    最近更新 更多