Состояние маршрутизатора UI не загружается

Я сконфигурировал некоторое базовое состояние в значительной степени, как должно, но, кажется, шаблон не вводит в <div ui-view></div>.Состояние маршрутизатора UI не загружается

Вот мой код.

https://plnkr.co/edit/LaMMc8JpCuq09Dav7CFW

EDIT:

Мои Index.html

<!DOCTYPE html> 
<html ng-app="crudMasters"> 

    <head> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
    <script data-require="[email protected]*" data-semver="3.0.0" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.9/angular.min.js"></script> 
    <script data-require="[email protected]*" data-semver="1.0.0-beta.2" src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.0-beta.2/angular-ui-router.js"></script> 
    <link rel="stylesheet" href="style.css" /> 
    <script src="script.js"></script> 
    </head> 

<body ng-controller="mainCtrl"> 

    <div ui-view></div> 

</body> 

</html>

script.js

var app = angular.module('crudMasters', ['ui.router']); 
app.config(function($stateProvider, $urlRouteProvider){ 


$urlRouteProvider.otherwise('/'); 

    $stateProvider 
    .state('root',{ 
     url: '/', 
     templateUrl: "home.htm" 
    }) 
    .state('root.master1', { 
     url: '/master1', 
     templateUrl: "master1.htm", 
     controller: 'master1Ctrl', 
     controllerAs: '$ctrl' 
    }) 
    .state('root.master2', { 
     url: '/master2', 
     templateUrl: "master2.htm", 
     controller: 'master2Ctrl', 
     controllerAs: '$ctrl' 
    }) 
}) 
app.controller('mainCtrl', mainCtrl); 


function mainCtrl(){ 
    let ctrl = this; 

}

источник

2016-12-03 kushalvm

У вас есть много проблем с вашим кодом,

(я) Это не urlRouteProvider это $urlRouterProvider

app.config(function($stateProvider, $urlRouterProvider) { 
$urlRouterProvider.when("", "/"); 
    $stateProvider 
    .state('root', { 
     url: '/', 
     templateUrl: "home.html", 
     controller: 'HomeCtrl' 

    }) 
    .state('root.master1', { 
     url: '/master1', 
     templateUrl: "master1.html", 
     controller: 'master1Ctrl' 

    }) 
    .state('root.master2', { 
     url: '/master2', 
     templateUrl: "master2.html", 
     controller: 'master2Ctrl' 
    }) 
})

DEMO

источник

2016-12-03 07:47:59 Sajeetharan

Я не совсем уверен, если я получу вашу первую строку. В моем коде тоже $ urlRouteProvider. – kushalvm

это маршрутизатор не маршрут – Sajeetharan

проверить демонстрационную версию – Sajeetharan

1) Основной вопрос кода является вашим первым маршрутом,

.state('root',{ 
    url: '/', 
    templateUrl: "home.htm" 
})

Должно быть ,

.state('root',{ 
    url: '', 
    templateUrl: "home.htm" 
})

У этого должно быть url как '', если вы не используете '/' url.

2) Кроме того, как упомянуто @Sajeetharan, $urlRouteProvider, должно быть $urlRouterProvider.

проверить это plunker сейчас, с тем же кодом, что и ваш, и с этими двумя изменениями

Working DEMO with your code

Таким образом, сделать эти два изменения, и ваш plunker хорошо идти.

источник

2016-12-03 08:04:51 Sravan

@Megaracer, Sajeetharan заметили одну из ваших проблем, у вас также есть еще одна проблема с вашим маршрутом, я изменил это. просто проверьте это. не нужно даже использовать, когда здесь, – Sravan

Я действительно упомянул обо всех проблемах с кодом, хотя это не ответ. Этот ответ почти тот же – Sajeetharan

Я не сказал, что вы ошибаетесь, я думаю, что лучше избегать 'когда' с' ui-router' – Sravan

Состояние маршрутизатора UI не загружается

ответ

Смежные вопросы