Question

我正在使用AngularJS构建我正在构建的应用程序，并且想知道当项目被推送到名为places的JSON对象时是否可以生成页面。推送时每个项目都有一个唯一的ID，我想我可以使用此ID（例如123456）作为网址的一部分，如site.com/places/123456。

{
  "places" : [
    {
      "id" : 471756,
      "title" : "The Whittington Hospital"
    }
  ]
}

是否可以自动生成此页面（例如，基于模板）？

我问，因为我正在尝试构建一个让用户通过表单创建自己的医院的应用程序。创建医院并将其推送到JSON对象后，我希望为该医院创建一个页面。

我可以使用Angular吗？任何帮助表示赞赏。

提前致谢！

更新

还有一点麻烦。这是我到目前为止所做的事情。

place.html

<div ng-controller='PlaceCtrl'>
  <h1>{{ title }}</h1>
</div>

JS

app.constant('FBURL', 'https://luminous-fire-8685.firebaseio.com/');

app.config(['$routeProvider', function ($routeProvider) {
  $routeProvider
    .when('/places/:placeId', {
      templateUrl: 'views/place.html',
      controller: 'PlaceCtrl'
    })
}]);

app.factory('place', function($firebase, FBURL, $routeParams) {
  var ref = new Firebase(FBURL + "places/" + $routeParams.placeId);

  return {
    id: $routeParams.placeId
  }
});

app.controller('PlaceCtrl', function($scope, $rootScope, FBURL, $firebase, $location, $routeParams, place) {
  $scope.placeId = place.id;
});

Answer 1

您正在寻找ngRoute和$routeProvider。有了这些，您可以设置如下参数化路线：

.when('/place/:placeId', { templateUrl: 'place.html', controller: 'PlaceCtrl' })

因此，每次访问者点击以/place/开头的网址时，都会以PlaceCtrl和place.html结束。地点ID作为参数传递。

然后您可以在控制器中选择参数：

app.controller('PlaceCtrl', function($scope, FBURL, $firebase, $routeParams) {
    var ref = new Firebase(FBURL+"places/"+$routeParams.placeId);

另见：

我使用AngularJS，Firebase和AngularFire的示例应用程序：https://github.com/puf/trenches/blob/master/app.js（我从中复制/粘贴/修改上述代码段）
AngularJS documentation for routeParams
AngularJS tutorial's step on routing
（方式更好）Thinkster.io tutorial page on routeParams

基于JSON数据生成页面

1 个答案: