为什么Angular UI路由器不能加载我的模板？

我真的很喜欢Angular，因为它非常脆弱，我觉得我有一个非常简单的例子（可能是最简单的情况），它还没有工作。为什么Angular UI路由器不能加载我的模板？

这里是我的模块（所以我注入库）：

angular.module(
      'module', ['ui.router']

我的index.html：

<html data-ng-app="module"> 

<head> 
    ... several libraries and my js files including ui-router library js + my app.js where the state definitions are located. 
</head> 

<body> 
    <div ui-view></div> 
</body>

为什么没有我的模板在用户界面视图注射？

编辑：对不起，我很着急，忘了补充一些细节。我已经更新了app.js部分是这样的：

.state('default', 
     { 
     url: '/', 
     template: '<h1>default</h1>' 
     }) 
    .state('x', 
     { 
     url: '/x', 
     template: '<h1>X</h1>' 
     });

现在默认状态按预期工作。但我打电话的URL“主机/ X”我得到“不能GET/X”..当我打电话像“主机/＃X”的网址，它的作品。

但我也有我的app.js本节HTML5模式：在我的index.html的头部

$locationProvider.html5Mode({ 
    enabled: true, 
    requireBase: true 
    });

我也有这样的：

<base href="/">

我想， html5应该已经处理了哈希（＃）部分的url？我如何摆脱URL中的＃，所以我可以直接调用“主机/ x”？

来源

2017-07-04 akcasoy

你可以分享你完全app.js？如果没有app.js，很难获得完整的图片。另外，抬起头来。在你的URL中，你需要指定'index.html /＃/ x'来使用'x'状态。否则，您可以将该状态设置为默认状态。 – nightgaunt

您需要指定url属性并转到此URL以查看此页面。国家应该是这样的：

.state("yourStateName", { 
    template: "<h1>My Contacts</h1>", 
    url: "/stateURL" 
})

URL提供的这是工作例如形成我的项目：

angular.module("app") 

    .config(function ($urlRouterProvider, $locationProvider, $stateProvider) { 

    $locationProvider 
    .html5Mode(true); 
    $urlRouterProvider.when('/', '/url1'); 
    $urlRouterProvider.when('', '/url2'); 
    $urlRouterProvider.when('/url3', 'url4'); 
    $urlRouterProvider.otherwise('/url5'); 
});

来源

2017-07-04 07:34:05

对不起..我匆忙忘记在我的问题中添加网址..但我其实有一个网址部分，然后我打电话。 – akcasoy

您是否将组件注入模块？ –

我已更新问题 – akcasoy

为什么Angular UI路由器不能加载我的模板？

回答

相关问题