Question

我正在使用角度和弹簧启动开发一些项目，我有一些令人困惑的情况：

我有Spring Controller与我的应用程序共享视图文件名

@Controller
public class OfferViewController {

    @RequestMapping(value = "/addOffer", method = RequestMethod.GET)
    public String addView() {
        return "html/offer/addOffer";
    }

    @RequestMapping(value = "/showOffer/{offerId}")
    public String showOffer(@PathVariable("offerId") String offerId){
        return "html/offer/showOffer";
    }
}

我还有一些其他控制器来处理REST调用：

@RestController
public class OfferRestController {

    private OfferRepository offerRepository;

    @Autowired
    public OfferRestController(OfferRepository offerRepository) {
        this.offerRepository = offerRepository;
    }

    @RequestMapping(value = "/showOfferJson/{offerId}", method = GET, produces = APPLICATION_JSON_VALUE)
    public Offer showOffertest(@PathVariable("offerId") String offerId) {
        Offer offer = offerRepository.findOne(offerId);
        return offer;
    }

    @RequestMapping(value = "/saveOffer", method = POST)
    public ResponseEntity<Offer> saveOffer(@RequestBody Offer offer) {
        Offer offerSaved = offerRepository.save(offer);
        return new ResponseEntity<Offer>(offerSaved, HttpStatus.OK);
    }
}

我使用angular来开发我的UI。

当我开始阅读有关角度（单页应用程序内容）中的路由可能性时，我发现自己很困惑，所以我认为我不再需要 OfferViewController 。

我的问题是：

我是否应该有一个index.html页面来管理所有ng-routes？例如，ngRoute首先将addOffer.html第二个添加到contact.html等。
我是否仍需要Controller为我的首页提供所有ngRout？？
Mby我错了所以请给我一个如何正确做ngRouting的建议。

感谢您的帮助！

Answer 1

让我们从：什么是单页应用程序？

单页面应用程序是一个包含在一个HTML页面上的页面。因此，只有一个HTML-File从您的后端请求，其余的路由应该由前端管理。有关单页应用程序的详细说明，我相信网上有很多关于此的信息。

如何使用AngularJS进行路由？

转到不同路线的角色是在＆＃39;＃＆＃39;之后。所以它们位于url的片段部分，而这部分不会转移到服务器上。因此，后端不需要@Controller来提供不同的html。

要根据当前路线显示不同的内容，您可以指定应在所需路线上显示的控制器和partial.html文件。

phonecatApp.config(['$routeProvider', function($routeProvider) {
$routeProvider.
  when('/phones', {
    templateUrl: 'partials/phone-list.html',
    controller: 'PhoneListCtrl'
  }).
  when('/phones/:phoneId', {
    templateUrl: 'partials/phone-detail.html',
    controller: 'PhoneDetailCtrl'
  }).
  otherwise({
    redirectTo: '/phones'
  });
}]);

此代码示例正好位于AngularJS Tutorial - Routing Part之外。它显示了如何指定路线以及应在此路线上显示哪些内容。

此代码段告诉angular将部分HTML-File包含到使用ng-view指令的每个元素中。

所以你的index.html看起来像这样（再次复制出docs）

<!doctype html>
<html lang="en" ng-app="phonecatApp">
<head>
  <script src="bower_components/angular/angular.js"></script>
  <script src="bower_components/angular-route/angular-route.js"></script>
  <script src="js/app.js"></script>
  <script src="js/controllers.js"></script>
</head>
<body>

  <div ng-view></div>

</body>
</html>

如果您现在访问yourdomain.com/#/phones，则会加载您的index.html，angular包含文件中包含的html＆＃34; /partials/phone-list.html"进入使用ng-view - 指令

的div

什么是REST？

我认为没有人知道这个问题的确切答案，但你所做的绝对不是REST。它只是HTTP调用。您的端点看起来像RPC。第一步可以是使用接受GET-Request的端点/ offer / {id}和接受POST-Request的端点/ offer。如果您想提供一种方法来立即公开您的所有优惠，请添加接受GET请求的端点/优惠。

Spring Boot Web应用程序中的角度路由

1 个答案: