0

如果我有这样的典型路线:

angular.module('app', ['ngResource']).  
  config(function($routeProvider, $locationProvider) {
  .when('/item/:itemId', {
    template: '<div ng-bind-html-unsafe="html"></div>',
    controller: blobs.controller.RouteController,
  })
});

如何实现从服务器请求“动态视图”?IE。服务器的路由应该指向一个动态的 php 页面,填写并保存一些数据,并根据路由中给定的 itemId 返回它想要的任何 html。我尝试为模板容器设置一些复杂的路由监控和 ajax 请求,然后在加载 RouteController 时注入响应 html,即:

 Service.request('item/'+$routeParams.itemId, {}, function(r) {
    $scope.html = r;
    $compile($scope.html)($scope); //generates infinite loop for some reason?
    $scope.$apply();
});

但这并不完全奏效。PHP 的响应 html get 很好地加载到容器模板中,但数据绑定似乎不起作用(即,它到处都包含 {{*}})。

有一个更好的方法吗?我真的只是想改变这样的路线:

/item/My-Item 变成一个相同的“templateUrl”,即:/item/My-Item 或 /views/item/My-Item ..etc

感谢您的任何帮助!

瑞安

4

1 回答 1

2

这不是您问题的直接答案。但我认为这是一个重要的概念,你应该考虑。

为了充分发挥 AngularJS 的潜力,你必须完全理解它的范式。

Angular 是关于瘦服务器和胖客户端的。服务器主要是一个 RESTful 服务,它为您的前端应用程序提供数据。然后通过绑定将该数据呈现给视图。模板在客户端而不是服务器端处理。这种方法允许您更好地在服务器和客户端之间划分职责。

因此,考虑到您的用例,我建议将模板的“动态”逻辑从服务器端移动到客户端,并尽量不要混合它们。理想情况下,您的模板应该是静态文件,可以由某些 CDN 提供服务。您的服务器端逻辑依赖于呈现动态模板的所有数据都可以使用ngResource模块和 RESTfull 接口从服务器获取。您可以通过在客户端使用适当的绑定和指令来实现几乎任何呈现逻辑。您甚至可以创建自己的指令来隔离代码的可重复部分并干燥。

我希望它有所帮助。

于 2014-04-17T18:37:57.673 回答