Menu
right justified and i want to have a partial view depending on which tab was clicked. found some sample code online to get me started but am unable to figure out the tabs by following a sample code
index.html
<!doctype html>
<html ng-app="mainApp">
<head>
</head>
<body>
<div ng-view>
</div>
<script src="scripts/lib/angular.min.js"></script>
<script src="scripts/lib/angular-route.min.js"></script>
<script src="scripts/lib/bootstrap.min.js"></script>
<script src="app.js"></script>
</body>
</html>
app.js:
var mainApp = angular.module('mainApp', ['ngRoute']);
mainApp.config(function($routeProvider){
$routeProvider.when('/', {
controller: 'SearchController',
templateUrl: 'search.html'
})
})
Search.html
<div ng-controller="SearchController">
</div>
SearchController: Sample taken from example
angular.module('mainApp').controller('SearchController', function ($scope, $window) {
$scope.tabs = [
{ title:'Dynamic Title 1', content:'Dynamic content 1' },
{ title:'Dynamic Title 2', content:'Dynamic content 2', disabled: true }
];
$scope.alertMe = function() {
setTimeout(function() {
$window.alert('You\'ve selected the alert tab!');
});
};
});
Error:
[ng:areq] http://errors.angularjs.org/1.4.4/ng/areq?p0=search%2FSearchController.js&p1=not%20aNaNunction%2C%20got%20undefined
466
Looks like it's having trouble finding SearchController all together. Is your SearchController in its own file? If so, be sure to load it in your index.html!
So,
<script src="scripts/lib/angular.min.js"></script>
<script src="scripts/lib/angular-route.min.js"></script>
<script src="scripts/lib/bootstrap.min.js"></script>
<script src="app.js"></script>
<script src="path/to/controller/SearchController.js"></script>
EDIT: Ah, I see the issue. You have not yet defined "SearchController" in your app.js.
To do this -
In SearchController.js, change angular.module('mainApp') to angular.module('SearchController') Understand you are creating an angular module that is not yet apart of your 'mainApp' module.
Then, in your app.js, do var mainApp = angular.module('mainApp', ['ngRoute', 'SearchController']); This will properly inject your controller into your app, and it can be used correctly by your router.
99
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
