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

回答

相關問題