我正在使用 Symfony2 构建一个相当简单的 API,现在我正尝试在我的包中使用 AngularJS 制作一些简单的页面以最终显示我的结果API 调用。
如何让 AngularJS 正常工作?
我通过 app/console bundle:generate
生成了一个 bundle,所以我在 src/Portfolio/Bundle/APIBundle 下工作,这就是我基本上放置所有资源等的地方。一切真的。
Javascripts 位于 src/Portfolio/Bundle/APIBundle/Resources/public/js
js/KitchenSink.js
angular.module('KitchenSink', [], function($interpolateProvider){
$interpolateProvider.startSymbol('[[');
$interpolateProvider.endSymbol (']]');
});
js/index.ctrl.js
var module = angular.module('KitchenSink')
module.controller('IndexController', function(){
var vm = this;
vm.Title = 'Portfolio API KitchenSink';
});
基础模板:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>{% block title %}{% endblock %}</title>
{% block head %}{% endblock %}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
{% block stylesheets %}{% endblock %}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js"></script>
<script src="PortfolioAPIBundle::KitchenSink.js"></script>
{% block head_javascripts %}{% endblock %}
</head>
<body ng-app="KitchenSink">
{% block body %}{% endblock %}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
{% block javascripts %}{% endblock %}
</body>
</html>
部分索引:
{% extends 'PortfolioAPIBundle::base.html.twig' %}
{% block title %}Portfolio API KitchenSink{% endblock %}
{% block head_javascripts %}<script src="PortfolioAPIBundle::index.ctrl.js"></script>{% endblock %}
{% block body %}
<div ng-controller="IndexController as index" class="container">
[[ index.Title ]]
</div>
{% endblock %}
最佳答案
简单来说,你不应该使用基本模板,应该使用 symfony 作为后端。所以你需要创建一个简单的 html 模板并在你的 Angular 项目中初始化它,然后你可以发送其余的 api 请求。
关于javascript - AngularJS 在我的 SF2 应用程序中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28111780/