AngularJS UI路由器 - 模板不显示 [英] AngularJS ui-router - template not displaying

问题描述

我已经上egghead.io教程沿如下显示应用程序体系结构，并改变相关章节，以满足我的应用程序的需求。

I've been following along on a tutorial on egghead.io showing application architecture, and changing relevant sections to suit my application's requirements.

请记住我是相当新的角，所以希望这将是一个简单的问题被发现。

Please keep in mind I'm fairly new to Angular, so hopefully this will be an easy issue to spot.

我已经设置了多个控制器和模板分层方式对我的申请。我使用的UI路由器。

I've set up several controllers and templates in a hierarchical fashion for my application. I'm using ui-router.

下面是我的app.start.js定义和依赖

Here is my app.start.js definition and dependencies

angular.module('sb', [
    'ui.router',
    'angularLocalStorage',
    'events',
    'user'
]

我接下来要定义我events.js控制器和依赖性，随着stateProvider

I then go on to define my events.js controller and dependencies, along with the stateProvider

angular.module('events', [
    'sb.models.events',
    'events.show',
    'events.list',
    'events.edit',
    'events.create'
])
    .config(function($stateProvider) {
        $stateProvider
            .state('sb.events', {
                url: '/',
                views: {
                    'events@': {
                        controller: 'EventsCtrl as evm',
                        templateUrl: 'app/events/list/event-list.tmpl.html'
                    },
                }
            })
    })

在这一点上，一切工作正常。然而，当我尝试导航到url.com/#/events/create~~V，我可以看到Chrome开发人员工具检索的模板，但它没有更新的实际可见的模板来显示此。

At this point, everything is working fine. However, when I try to navigate to url.com/#/events/create, I can see the template being retrieved in chrome developer tools, but it's not updating the actual visible template to show this.

这是我的事件 - create.js

This is my events-create.js

angular.module('events.create', [

])
    .config(function($stateProvider) {
        $stateProvider
            .state('sb.events.create', {
                url: 'events/create',
                templateUrl: 'app/events/create/event-create.tmpl.html',
                controller: 'EventsCreateCtrl as ecc',
            })
    })

和只是为了澄清，我的主要HTML模板确实有一个用户界面视图=事件

and just to clarify, my main html template does have a ui-view="events"

任何指针将大量AP preciated

Any pointers would be massively appreciated

推荐答案

很难知道肯定不知道在您的UI的意见（张贴位的HTML向我们展示它是如何结构将帮助很多这样的情况下），但是这将是从给定的信息我最好的猜测：

在这里最大的问题是贵的事件list.tmpl.html包含UI的看法？因为它需要之一。当你呼唤你的状态的 sb.events.create 的你问你的路由器来加载它的 的里面的 sb.events -state。如果没有该州实际模板包含一个用户界面视图，它没有地方加入的HTML。

The big question here is does your event-list.tmpl.html contain a ui-view? Because it needs one. When you are calling your state sb.events.create you are asking your router to load it inside the main ui-view of the sb.events-state. If none of the templates for that state actually contains a ui-view, it has no place to add the html.

如果你其实是想替换事件创建模板的事件列表模板，那么你应该把它的 sb.eventsCreate 的或类似的，和/或将其加载到的事件@ 的以同样的方式为你加载你的活动列表。

If you actually wanted to replace the event-list template with the event-create template then you should call it sb.eventsCreate or similar, and/or load it into events@ in the same way as you are loading your events list.

另外，我认为这不是问题，因为你的事件列表加载罚款，但以防万一它不是明确：不是说的事件@ 的假定命名事件的UI视图位于根。如果视图位于发言权的 SB 的使用是相对名称（的事件的，即不带@）或事件@某人的

Also, I assume this is not the issue since your events-list loads fine, but just in case it's not clear: Not that events@ assumes that the ui-view named events is located in the root. If the view is located in say sb the use either relative names (events, i.e. without the @) or events@sb.

这篇关于AngularJS UI路由器 - 模板不显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！