如何将$ user对象从drupal传递给Angular JS应用程序,以便角度可以使用它?

时间:2013-09-20 21:17:22

标签: javascript angularjs drupal drupal-7

我有一个带有cutom模块的Drupal站点,我用它来调用角度应用程序。

这是模块代码:

/**
 * Implements hook_menu().
 */
function portfolio_menu() {
  $items = array();

  $items['portfolio'] = array(
    'access arguments' => array('access content'),
    'title' => t('Portfolio'),
    'page callback' => 'portfolio_page', 
  );

  return $items;
}

/**
 * Page callback: Displays Your Application on the page.
 *
 * @see your_application_menu()
 */
function portfolio_page() {
  $path = drupal_get_path('module', 'portfolio');
  drupal_add_js($path . '/lib/angular/angular.js');
  drupal_add_js($path . '/lib/angular/angular-resource.js');
  drupal_add_js($path . '/js/services.js');
  drupal_add_js($path . '/js/app.js');
  drupal_add_js($path . '/js/controllers.js');
  drupal_add_js($path . '/js/filters.js');
  drupal_add_css($path . '/css/app.css');
  drupal_add_css($path . '/css/bootstrap.css');
  return theme('portfolio');
}

function portfolio_theme($existing, $type, $theme, $path) {
  $theme = array();

  $theme['portfolio'] = array(
    'variables' => array(),
    'template' => 'portfolio',  
  );

  return $theme;
}

app.js:

angular.module('portfolio', ['tickerFilters', 'tickerServices']).
  config(['$routeProvider', function($routeProvider) {
  $routeProvider.
    when('/tickers', {templateUrl:'...portfolio/partials/ticker-list.html',   controller: TickerListCtrl}).
    otherwise({redirectTo: '/tickers'});
}]);

这是drupal加载的最后一个tpl.php文件:

<div ng-app="portfolio" ng-init="user = <? json_encode($user); ?>">
  <div ng-view></div>
</div>

我的问题是当我调用应用程序时如何将drupal $ user对象传递给angular,以便可以在angular应用程序中使用$ user数据?

2 个答案:

答案 0 :(得分:1)

你没有回显你需要使用<?=的json_encode的输出,而json_encode的输出包含双引号,所以你需要将它们改为单引号

<?= str_replace('"', "'", json_encode($user)); ?>

答案 1 :(得分:1)

此外,您可以将$ user变量添加到Drupal.settings,然后在angular .config或controller中使用它

function portfolio_page() {
  $settings['user'] = $user;
  drupal_add_js(array('portfolio' => $settings), 'setting');

然后在angular.config或控制器中使用它

angular.module('portfolio', ['tickerFilters', 'tickerServices'])
  .config(['$routeProvider', function($routeProvider) {
    var user = Drupal.settings.portfolio.user;
  }]);