Угловой JS UI-Router не работает

Он не отображает ничего в представлении и никакой ошибке в журнале консоли. Проверили с чувствительностью к корпусу тоже все еще не смогли решить проблему. Пила другие сообщения тоже все еще не могли найти, где я ошибаюсь. Нужно ли использовать ng-resource для UI-Router?Угловой JS UI-Router не работает

<!DOCTYPE html> 
    <html> 
    <head> 
    <title>Fad Street Den</title> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css"> 
    <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css"> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.0-alpha.4/angular-ui-router.js"></script> 
    <body cz-shortcut-listen="true"> 
    <div> 
    {{name}} 
    <div ui-view="header"></div> 
    <div ui-view="content"></div> 
    </div> 
    <script type="text/javascript" src="app.js"></script> 
    <script type="text/javascript" src="controller.js"></script> 
    <script type="text/javascript" src="services.js"></script> 
    </body> 
    </html>

App.js файл

var app=angular.module('myApp', ['ui.router']); 
    .config(function($stateProvider,$urlRouterProvider) 
    { 
    $stateProvider 
    .state('home', 
    { 
    url:'/', 
    views: 
    { 
    'header': 
    { 
     templateUrl:"header.html" 
    }, 
    'content': 
    { 
     templateUrl:"body.html", 
     controller:"productscontroller" 
    } 
    } 
    }) 
    $urlRouterProvider.otherwise('/'); 
    })

Controller.js Файл

var app=angular.module('myApp'); 
    app.controller('productscontroller', 
    ['$scope','productservice',function($scope,productservice) 
    { 
    $scope.name="kannan"; 
    productservice.productlists().then(function(response) 
    { 
    $scope.ans=response.data; 
    console.log($scope.ans); 
    },function(response) 
    { 
    console.log(response.status); 
    return response.status; 
    }); 
    }]);

header.html

<body ng-app="myApp" ng-controller="productscontroller"> 
    <ul class="nav navbar-nav"> 
    <li class="active"><a ui-sref="home">Home</a></li> 
    <li><a ui-sref="home">Home</a></li> 
    </ul> 
    </body>

Body.html

<body ng-app="myApp" ng-controller="productscontroller"> 
    <div> 
    <div style="height: 200px;" ng-repeat="x in ans"> 
    <img style="width: 100px;height: 100px;float: left;" class="img-responsive" 
     ng-src="{{x.imageURL1}}"> 
     <h1>{{x.color}}</h1> 
     <p>{{x.brand}}</p> 
     <p>{{x.gender}}</p> 
    </div> 
    </div> 
    </body>

источник

2016-09-01 Kannan

Мы должны предоставить ng-app="myApp" на максимально возможном уровне корней. В основном на index.html

<body ng-app="myApp" ...

или даже на <html>(например, чтобы иметь возможность регулировать <title>, которая является частью <head>)

<html ng-app="myApp" ...

header.html и тело .html(как показано выше) не будет работать, , потому что это не приведет к запуску приложения вообще

источник

2016-09-01 08:22:06

Спасибо, что он работает сейчас, но могу ли я знать причину, по которой он вообще не срабатывает? – Kannan

После исправления: 1) index.html загружен (всегда) 2) он находит ng-приложение, и угловые могут начать работать 3) состояния правильно установлены 4) ui-view используется и заполняется. ** Перед исправлением ** 1) загружен index.thml 2) ng-app не найден - НЕТ Угловое приложение запускается ... остановлено здесь ... надеюсь, что это немного помогает;) –

Я настоятельно рекомендую - задавать новый вопрос. В самом деле. Вы получите более широкую аудиторию .. и, конечно же, помощь, которой вы заслуживаете;) –

Угловой JS UI-Router не работает

ответ

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