爲什麼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路由器不能加載我的模板？

回答

相關問題