ui-router不呈现视图 [英] ui-router not rendering views

问题描述

我最近拆开了自己拥有的Rails应用程序，并与yeoman一起将前端创建为单独的应用程序.由于某种原因，我的视图不再呈现，例如我的应用定义了:

I recently split out a rails app I had and created the front end as a separate app with yeoman. For some reason my views no longer render, for example my app defines:

    'use strict';

    var actionTrackApp = angular.module('actionTrackApp', [ 'ui.router', 'ngGrid']);
    actionTrackApp.config(function($locationProvider) {
      return $locationProvider.html5Mode(true);
    });
    actionTrackApp.config(function($stateProvider){
      $stateProvider
        .state("packageIndex", {
          url: "/packages",
          views: {
            "main": {
              controller: "ApplicationCtrl",
              template: "<h1>Test</h1>"
            },
            "": {
              template: "<h1>Test2</h1>"
            }
          },
          resolve: {
            test: function(){
              console.log("test")
            }
          }
        })  
    });

以及在我的index.html文件中:

and in my index.html file I have:

bodytag ng-app="actionTrackApp" ng-controller="ApplicationCtrl">
    your site or application content here<a href='/packages'>Package Index</a>

    <div ng-view="main" class="container"></div>
    <div ng-view=""></div>
/bodytag

当我单击链接时，resolve属性确实解析，并且我在控制台中看到测试".我尝试在应用程序控制器上附加$ routeChangeStart/success手表，但此处都未启动/成功触发.

When i click the link the resolve property does resolve and I see "test" in the console. I tried attaching $routeChangeStart/success watches on applicaiton controller but neither start/success fire here.

推荐答案

我查看了您的代码，发现了几个问题

I took a look at your code and found a couple issues

1. 要引用ui路由器视图，必须使用指令ui-view，而不是ng-view
2. "视图的定义不正确-您必须使用有效的键名，我将其更改为a并更新了html中的引用

1. to reference ui-router views, you must use the directive ui-view, not ng-view
2. the "" view is incorrectly defined - you must use a valid key name, I changed it to aand updated the reference in the html

在我进行了这些更改之后，所有操作都按预期在这里进行: http://plnkr.co/edit/lxAUGMqajwI461VKz8xo

After I made these changes, all works as expected here: http://plnkr.co/edit/lxAUGMqajwI461VKz8xo

ps:我继续在您的链接上使用ui-sref，而不是对/package url进行硬编码...

ps: I went ahead and used ui-sref on your link instead of hard-coding the /package url...

这篇关于ui-router不呈现视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！