[英]How do you load partials from a non-standard directory in angular.js?
I have my angular app set up as a bundle within a Symfony app. 我将我的角度应用程序设置为Symfony应用程序中的捆绑包。 Because of this restriction, the directory structure for the angular app is different.
由于此限制,Angular App的目录结构不同。 All public resources are symlinked to a static directory, including the partials.
所有公共资源都符号链接到静态目录,包括部分目录。 I got the app to load, the controllers fire, but none of the partials load for their specific controllers.
我加载了应用程序,控制器启动,但是没有加载特定控制器的部分内容。 I had this working as a standalone app (outside of Symfony), so I must be missing something with the new configuration.
我将其作为独立应用程序(在Symfony之外)工作,因此我必须在新配置中缺少某些功能。
index.html.twig: index.html.twig:
note: the javascript files load just fine- that is the correct asset path 注意:javascript文件加载的很好-这是正确的资产路径
<body ng-controller="MainController">
<nav class="navbar navbar-default" role="navigation">
<div class="container">
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="#/">Home</a></li>
<li><a href="#/groups">Groups</a></li>
</ul>
</div>
</nav>
<div ng-view=""></div>
<div ng-view></div> <!--[if lt IE 7]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.min.js"></script>
<script src="bundles/translations/webadmin/app/js/ngroute.js"></script>
<script src="bundles/translations/webadmin/app/js/app.js"></script>
<script src="bundles/translations/webadmin/app/js/services.js"></script>
<script src="bundles/translations/webadmin/app/js/controllers.js"></script>
<script src="bundles/translations/webadmin/app/js/filters.js"></script>
<script src="bundles/translations/webadmin/app/js/directives.js"></script>
</body>
app.js: app.js:
note: I tried making templateUrl just partials/ as well 注意:我也尝试使templateUrl也只是partials /
angular.module('myApp', [
'ngRoute',
'myApp.filters',
'myApp.services',
'myApp.directives',
'myApp.controllers'
]).config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/groups', {templateUrl: 'bundles/translations/webadmin/app/partials/groups.html', controller: 'GroupsController'});
$routeProvider.when('/', {templateUrl: 'bundles/translations/webadmin/app/partials/home.html', controller: 'HomeController'});
$routeProvider.otherwise({redirectTo: '/'});
}]);
controllers.js controllers.js
note: the alerts fire just fine, but the partials don't load... 注意:警报可以正常触发,但是部分加载不会...
angular.module('myApp.controllers', [])
.controller('MainController', ['$scope', function($scope) {
alert('here?');
}])
.controller('HomeController', ['$scope', function($scope) {
alert('here2');
}])
.controller('GroupsController', ['$scope', function($scope) {
// TODO see below
}]);
console output: 控制台输出:
Consider using 'dppx' units, as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query expression: (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) translations:1
Blink is considering rejecting non spec-compliant cross-origin web font requests: https://d3nkxvtkt5c8vi.cloudfront.net/0.4.2/fonts/proxima_nova_light_0.woff. Please use Access-Control-Allow-Origin to make these requests spec-compliant.
Any idea what I am missing here? 知道我在这里缺少什么吗? Any help would be greatly appreciated.
任何帮助将不胜感激。
It looks like the problem you have is that ng-view
is missing from your index markup. 看来您的问题是索引标记中缺少
ng-view
。
<div ng-view=""></div>
Without this element, your controllers will load, but have no place to insert your view templates. 没有这个元素,您的控制器将被加载,但是没有位置插入您的视图模板。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.