AngularJS和Angular-Route-Segment

我是AngularJS的新手，所以任何提示都会受到欢迎，因为我仍然试图围绕一切工作。AngularJS和Angular-Route-Segment

下面的控制器包含其中的其他控制器，但我已经缩短了代码复制我的问题没有内部细分（我会有更多的错误，一旦我添加）。

这是我的HTML部分：

<div ng-app="app"> 
<div class="ng-cloak" ng-controller="mainController"> 
    <a ng-class="{active: ('sectionHome' | routeSegmentStartsWith)}" href="#{{'sectionHome' | routeSegmentUrl}}">Home</a> 

    <div id="content" style=""> 
     <div app-view-segment="0"></div> 
    </div> 

    <div id=loading class=alert ng-show="loader.show">Loading...</div> 
</div> 
</div>

和JavaScript：

var app = angular.module('app', ['ngRoute', 'ngAnimate', 'route-segment', 'view-segment']); 

app.config(function($routeSegmentProvider, $routeProvider) { 

$routeSegmentProvider.options.autoLoadTemplates = true; 

$routeSegmentProvider  
    .when('/Home', 'sectionHome') 
    .segment('sectionHome', { 
     'default': true, 
     templateUrl: '../templates/sHome.html', 
     controller: 'mainController'})    

$routeProvider.otherwise({redirectTo: '/Home'}); 
}) ; 

app.value('loader', {show: false}); 

app.controller('mainController', function($scope, $routeSegment, loader) { 

$scope.$routeSegment = $routeSegment; 
$scope.loader = loader; 

$scope.$on('routeSegmentChange', function() { 
    loader.show = false; 
}) 
});

我现在不是失去了一些东西的概念或其他一些大的事情，因为当我检查的链接似乎范围绑定没有在html文档中设置，我仍然与“ng-class =”{active：（'sectionHome'| routeSegment ...“。

我试过编辑jsFiddle（http://jsfiddle.net/3boccdu6/）但是，我收到错误 “.. [$ injector：nomod]模块'app'不可用！你要么拼写错误的模块名称或忘了加载它。”

这将使意义，但我真的不知道我做错了，我一直在关注这方面的工作例如： http://angular-route-segment.com/src/example/#/section3

来源

2015-02-11 g3trans

我要去尝试从头开始重写，而无需使用角路由段模块。就在角路线模块。不过任何意见会受到欢迎 – g3trans 2015-02-11 18:39:04

嗨，angular-route-segment的作者在这里。你的jsfiddle不工作，因为inco正确的模块依赖关系。我在这里修改了它：http://jsfiddle.net/3boccdu6/1/ 现在你可以基于这个小提琴来演示你的问题，这样可以更容易地帮助你。 – artch 2015-04-10 08:37:36

添加以下到您的HTML将解决此问题。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.6/angular.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.6/angular-resource.min.js"> 
</script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.6/angular-route.min.js"> 
</script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-route-segment/1.4.0/angular-route-segment.min.js"> 
</script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular-animate.min.js"> 
</script> 
<script src="app.js"></script>

来源

2015-09-29 23:55:11

AngularJS和Angular-Route-Segment

回答

相关问题